设置react中的状态延迟

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，以确保它运行，事实上确实如此。我期望的行为是状态立即更新。

但是，所选下拉列表的状态不会更新。在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.logarrayId标题的是“定量产品25”console.log（我运行），然后这个状态不显示定量产品25

Answer 1

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

我想你可能还有其他问题。

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