问题
使用.map(function(Item)生成元素添加onClick事件：onClick={this.provinceChange.bind(this, "99")}时，前台访问报错：Uncaught TypeError: Cannot read property 'provinceChange' of undefined。provinceChange是在class中定义的方法：
provinceChange: function(selectedProvince){
this.setState({
province : selectedProvince
});
},
解决
原调用provinceChange方法代码如下：
render: function() {
let waveProvinceArr = this.state.waveProvinceList;
return (
<div>
<div>
{
waveProvinceArr.map(function(waveProvinceItem){
return <button type="button" onClick={this.provinceChange.bind(this, waveProvinceItem)}>{waveProvinceItem}</button>
})
}
</div>
</div>
);
}
通过分析为this在嵌套函数中，而嵌套函数可以通过闭包捕获父函数的变量，但是这个函数没有继承this，所以导致this指向不明报错undefined。
修改方法有：
1、bind(this)：
{
waveProvinceArr.map(function(waveProvinceItem){
return <button type="button" onClick={this.provinceChange.bind(this, waveProvinceItem)}>{waveProvinceItem}</button>
}.bind(this))
}
2、将this做为参数传入：
{
waveProvinceArr.map(function(waveProvinceItem){
return <button type="button" onClick={this.provinceChange.bind(this, waveProvinceItem)}>{waveProvinceItem}</button>
}, this)
}
3、在render中将this捕获为self，使用this时改为使用self：
render: function() {
let waveProvinceArr = this.state.waveProvinceList;
let self = this;
return (
<div>
<div>
{
waveProvinceArr.map(function(waveProvinceItem){
return <button type="button" onClick={self.provinceChange.bind(self, waveProvinceItem)}>{waveProvinceItem}</button>
})
}
</div>
</div>
);
}
4、将waveProvinceArr.map(function(waveProvinceItem)方法换成在render或者方法中使用push生成：
可以参考：【原】React中,map出来的元素添加事件无法使用
参考文章
JavaScript中的this陷阱的最全收集--没有之一
严格模式详解
MDN中Function.prototype.bind()