javascript - 根据 Ajax 调用中收到的数据 react 设置状态

Question

我正在尝试使用看起来像这样的 AJAX 调用从我的服务器获取一些数据

fetch_reviews() {
    var scraper_url = this.props.thing.text
    var all_the_data = $.get({
      url: window.location.origin+'/fetch_review_data', 
      data: {scraper_url: scraper_url}
    }).success(function(data){
      this.state.allReviews = data
    });
  } 

只有我不断收到错误消息“无法读取未定义的属性 allReviews”

如何从 success 函数内部设置 allReviews 的状态？

Answer 1

你应该使用 arrow function (如果你使用 ES2015)或 .bind为了设置将引用您的组件对象的 this，因为现在 this 引用全局范围(window 或 undefined 如果你使用 strict mode ),

// ...
.success((data) => {
   this.setState({ allReviews: data })
});

或

// ...
.success(function (data) {
   this.setState({ allReviews: data })
}.bind(this));

此外，如果您需要在 React 中设置新状态，则必须使用 setState方法