ReactJS TypeError：无法读取属性＆＃39; setState＆＃39;

Question

我是ReactJS的新手，我遇到了一些问题。

我还了解了ES6语法，它说下面的代码含义相同。

1

YTSearch({key: API_KEY, term: 'nba'}, function(videos) {
  this.setState({ videos });
});

2

YTSearch({key: API_KEY, term: 'nba'}, (videos) => {
  this.setState({ videos });
});

然而，第一种方式抛出此错误

TypeError: Cannot read property 'setState' of undefined

Answer 1

YTSearch({key: API_KEY, term: 'nba'}, function(videos) {
  this.setState({ videos });
});

引发错误，因为回调中的this不会引用context of React Component而是引用函数本身的上下文，因此setState未定义。

在第二个例子中

YTSearch({key: API_KEY, term: 'nba'}, (videos) => {
  this.setState({ videos });
});

您正在使用arrow函数将函数绑定到react组件的上下文。另一种方法是使用bind(this)

YTSearch({key: API_KEY, term: 'nba'}, function(videos) {
  this.setState({ videos });
}.bind(this));