Question

我目前在react native中有一个函数可以执行以下操作：

resetThenSet = (id, arrayId, title) => {
    if(arrayId != 'selectProduct') {
            // Setting state for each selected dropdown in selectedDropdowns
             this.setState({
               dataShowingToggle: true,
               selectedDropdowns: {...this.state.selectedDropdowns, [arrayId]: title}
             }, this.getProductCost(arrayId, id)
           );
}

运行上面的命令，我可以确认arrayId和title变量有效并且包含数据。 arrayId也不是“ selectProduct”。我在调试时在其中添加了console.log以确保它可以正常运行。我期望的预期行为是状态立即更新。

但是selectedDropdowns的状态尚未更新。当我添加：在this.setState更新之后，console.log（this.state）没有变化。如果我两次运行该函数，它将在第二次运行时更新。

为了进一步测试它，我添加了静态输入，如下所示：

this.setState({
           dataShowingToggle: true,
           selectedDropdowns: {...this.state.selectedDropdowns, testField: 'me here'}
         }, this.getProductCost(arrayId, id)
       );
       console.log(this.state);

仅在首次运行后更新状态。我想念什么吗？

更新：我更新了代码以在调用setstate的调用上运行console.log：

  if(arrayId != 'selectProduct') {
    // Setting state for each selected dropdown in selectedDropdowns
    console.log(arrayId + title);
    console.log('i run');
     this.setState({
       dataShowingToggle: true,
       selectedDropdowns: {...this.state.selectedDropdowns, [arrayId]: title}
     }, console.log(this.state)
   );
  };

console.log是arrayId +标题的“ quantityProduct 25” console.log（我运行）然后此状态未显示数量product 25

Answer 1

setState是异步的。这就是函数调用具有可选回调的原因。

我认为您可能还有其他问题。

当您调用setState时，请尝试将该控制台日志放入回调函数中，以查看何时使用您提供的值更新状态。

setState反应延迟

1 个答案: