Question

我正在尝试找出2个功能之间的区别。在我的反应本机应用程序，我使用AppState eventlistener检查该应用程序在后台或前台运行（请参见下面的代码）：

AppState.addEventListener('change', this._handleAppStateChange);

函数如下：

  _handleAppStateChange = (nextAppState) => {

      console.log('nextAppState', nextAppState)

      this.setState({
          appState: nextAppState
      });

  };

我不喜欢te函数的制作方式，因为在侦听器中您没有参数就调用它但是它本身具有参数。因此，我想对此进行更改以使其更加清晰。就是这样的：

  _handleAppStateChange (nextAppState) {

      console.log('nextAppState', nextAppState)

      this.setState({
          appState: nextAppState
      });

  };

这可以正常工作，nextAppState仍然被记录，但是setstate不再起作用是说这不是功能。有人可以解释一下为什么吗？

有人可以解释一下这两种功能中哪一种是最好的。

非常感谢！

Answer 1

开始使用箭头函数，创建箭头函数的原因之一是针对您提到的问题，即在函数上下文中丢失this。

因此，为了使您的函数正常工作，您需要将该函数绑定到this。在构造函数中，添加以下行

this._handleAppStateChange = this._handleAppStateChange.bind(this)

或者您可以替换此功能

AppState.addEventListener('change', this._handleAppStateChange);

到

 AppState.addEventListener('change', (nextAppState) => this._handleAppStateChange(nextAppState));

奖金。如果您需要传递除nextAppState之外的其他参数，或者该参数处于状态。这行行不通

 AppState.addEventListener('change', (nextAppState, this.state.someRandmValue) => this._handleAppStateChange(nextAppState, this.state.someRandmValue));

由于this.state.someRandomValue是未定义的，因为handleAppState不会发出该值，而是使用

 AppState.addEventListener('change', (nextAppState) => this._handleAppStateChange(nextAppState, this.state.someRandmValue));

对正常功能（Appstate）反应Native ArrowFunction

1 个答案: