设置状态的新 Promise 接收箭头函数答案

【问题标题】：new Promise with set state receives an arrow function设置状态的新 Promise 接收箭头函数
【发布时间】：2021-12-04 04:04:11
【问题描述】：

我正在浏览一个反应代码库，在那里我看到 Promise 函数调用带有 2 个参数的 setstate，我无法准确理解它是如何工作的，在任何地方我都看到创建了一个具有一个对象参数的 setState，但在这里我们有一个 resolve 参数，它获取一个带有对象的 setstate 和一个调用 resolve 的箭头函数。另一个箭头函数，我不知道它在做什么以及这段代码是如何工作的

这就是我的状态

constructor(props){
        super(props);
        this.state = {
            articles:[],
            loading:true,
            page:1,
            totalResults : 0
        }
    }

这是我的代码库中的代码，我无法理解。

handleNextClick = async ()=>{
    await new Promise(resolve => this.setState({page: this.state.page+1}, () => resolve())); // same as await this.setState({page: this.state.page+1});
    await this.updateNews();
}

如您所见，Promise 正在接收 resolve 箭头函数，该函数使用对象和箭头函数调用 setstate。有人可以解释一下这是如何工作的吗？

【问题讨论】：

因为我们需要等到状态更新完毕，所以使用await，lly，也用于更新
回调运行状态已经更新，所以你不需要等待任何东西。
在我的情况下，页码稍后会更新，我们使用过时的页面变量调用 setState
@Andy 设置状态接收的第二个箭头函数参数是什么，何时调用它

标签： javascript reactjs promise arrow-functions resolve

【解决方案1】：

代码没有多大意义，这可能是它难以理解的原因。

setState has a callback option。所以你不需要承诺，也不需要等待 setState。此外，您可能也不需要等待 updateNews，因此您可以从 handleNextClick 函数中删除异步。

这可能是函数的样子。

handleNextClick () {

  // Set the new state, then use the callback option
  // to call `updateNews`
  this.setState( { page: this.state.page + 1 }, () => {
    this.updateNews();
  });
}

【讨论】：