首页 > 解决方案 > React - setState 不更新数组

问题描述

这是我的代码:

class App extends Component {
  state = {
    query: '',
    results: []
  }
  handleSearch(e) {
    var query = e.target.elements.query.value;
   axios.get("http://www.omdbapi.com/?s=" + query + "&page=1&apikey=xxxx")
      .then(function (response) {
        console.log(response.data);
        this.setState({
          results: response.data.Search
        });
      }.bind(this))
      .catch(function (error) {
      });
    e.preventDefault();
  }

我正在尝试从omdb获取数据并将其显示在页面上。

问题是 setState 没有更新数组results

任何想法 ?谢谢

标签: javascriptreactjsstate

解决方案


您绑定 axios 请求正确完成时调用的函数,但您还必须绑定handleSearch方法本身。您可以在构造函数中执行此操作,或者使用类属性箭头函数:

class App extends Component {
  state = {
    query: '',
    results: []
  }

  handleSearch = (e) => {
    // ...
  }
}

推荐阅读