最近项目要求使用reactnative开发，对于我这个新手来说已上手就遇到了许多奇奇怪怪的问题，今天我就来说说遇到的第一个坑遇关于调用函数时绑定
this的迷惑，在使用reactnatve的过程中恍恍惚惚感觉到了一些些函数式编程的魅力，一个函数作为另外一个函数的参数来使用。在react中使用函数时，经常需要bind（this）有时候你搞忘记bind了，吼吼，将会出现一整屏的鲜红伴着一些摸不着头脑的错误，so，一切都显得那么悲伤。好了，下面我来跟大家分享一下我绑定this使用的三种方法吧，推荐大家使用第三种。
先说明一下this到底是什么鬼：：“this所指的就是直至包含this指针的上层对象”（如果还不是很理解的话那就google一下吧！）
方法一
在 constructor(props) 中将所有的定义的方法全部绑定一次 this，就像这样：
constructor(props) {
super(props);
this.state = {
user: undefined,
data: undefined,
dataSource: new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 }),
expanded: false,
order: 1,
page: 1,
isFollowing: false,
};
this.sortBtnPressed = this.sortBtnPressed.bind(this);
this.becomeCreatorBtnPressed = this.becomeCreatorBtnPressed.bind(this);
this.nextPage = this.nextPage.bind(this);
this.sortOptionPressed = this.sortOptionPressed.bind(this);
this.followBtnPressed = this.followBtnPressed.bind(this);
}
显得格外麻烦和臃肿有木有😂，当然你也可以写一个方法为所有的函数去循环绑定this
方法二
在需要调用方法的时候绑定 this，比如：
<TableView data = {this.state.data}
dataSource = {this.state.dataSource}
requestData = {this.requestData}
didSelectMsg = {this.didSelectMsg.bind(this)}
/>
这种做法也不是很推荐，到处都在绑定 this 看起来不是很舒服
方法三
采用ES6 箭头函数的写法，既方便又整洁
requestData = () => {
const nextIndex = this.state.pageIndex + 1;
this.setState({
pageIndex: nextIndex,
});
NativeModules.LivePlayerListModule.requestLivePlayerList(
nextIndex,
(data) => {
this.updateDataSource(data);
}
);
}
箭头函数没有它自己的this值，箭头函数内的this值继承自外围作用域。因此我们在调用函数的时候完全可以放心大胆的去调用，不用再操心这个this要从那里获取，它指代的又是谁
有写问题我还没有弄得太明白，因此本文会不定期更新
如果在阅读过程中遇到什么错误欢迎指正😄
