setState的异步返回值

你可以退一个新的 Promise 从…起 myFunction setState .

然后你可以用 async / await 在你的 otherFunction .

myFunction = () => {
  return new Promise(resolve => {
    let originalFoo;
    this.setState(
      state => {
        originalFoo = state.foo;
        return {
          foo: "bar"
        };
      },
      () => resolve({ originalFoo, newFoo: this.state.foo })
    );
  });
};

otherFunction = async () => {
  var originalValue = await myFunction();
};

我下面的实现不使用async/await。如果你需要等到 setState 如果完成了,你最好还是接受Thole的答案。但是,如果您只想返回一个具有值的对象,而不管状态是否已完全设置,那么我的方法就更简单了。

myFunction = () => {
  let returnData;
  this.setState(state => {
    // do some stuff here
    returnData = { originalBar, newBar: state.foo };
    return {
      foo: "bar"
    };
  });

  return returnData;
}

otherFunction = () => {
  var originalValue = this.myFunction();
}

但是,我不建议这样做,相反,我会尽量不在中使用函数回调 this.setState

const originalBar = this.state.foo; // or whatever it might be
const newBar = "bar";
this.setState({ foo: newBar });
return { originalBar, newBar };

比较短,比较优雅。

看起来您想要访问上一个状态和当前状态。而不是使用 setState 要做一些不打算做的事情,您可以在react中使用生命周期方法,它根据您的用例为您提供以前的状态和以前的道具。

componentDidUpdate(prevProps, prevState, snapshot){
  ...
}

或

getSnapshotBeforeUpdate(prevProps, prevState){
...
}