Question

在我的ReactJS项目中，我使用fetch做异步处理，并在获取数据后，

我想setState来改变我的本地状态。但我得到错误返回。

Uncaught (in promise) TypeError: Cannot read property 'setState' of undefined

获取功能代码：

AddDeal(deal){
fetch('shops/1/deals',{
      method: "POST",
      body: JSON.stringify(deal),
      headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
      },
    }).then(response => {
         response.json().then(data =>{
           this.setState({deals: data}); // and use this.props.dispatch I get `props` of undefined 
         })
      })
}

我看过另一个问题，比如我React.js: loading JSON data with Fetch API and props from object array

那我该怎么办呢？

Answer 1

当您致电fetch()时，this的值将是响应，而不是类。您可以通过将this赋值给变量来保存self的值，通常称为AddDeal(deal){ const self = this; fetch('shops/1/deals',{ method: "POST", body: JSON.stringify(deal), headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, }).then(response => { response.json().then(data =>{ self.setState({deals: data}); }) }) }。

\{([^}]+?)(?:\(([^)]+)\))?\}
        ^

Answer 2

这可能会解决您的问题：

AddDeal = (deal) => {
  fetch('shops/1/deals',{
    method: "POST",
    body: JSON.stringify(deal),
    headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json'
    },
  }).then(response => {
    response.json().then(data =>{
      this.setState({deals: data});
    })
  })
}

Answer 3

尝试这样，这是正确的方法

constructor(props) {
    super(props)

   ..............
   ..............
   ..............

    this.AddDeal = this.AddDeal.bind(this)
}

Answer 4

我建议您使用Axios而不是使用fetch，因为与Fetch相比，axios具有更多强大的功能。您可以从Link了解Axios的强大功能。

ReetchJS在Fetch POST时，然后使用then函数来设置

4 个答案: