React setState回调返回值

我是 React 新手，我希望实现这种流程：

// set the state
// execute a function `f` (an async one, which returns a promise)
// set the state again
// return the promise value from the previous function

所以，我现在正在做的事情如下：

async function handleSomething() {
  this.setState((prevState) => { ... },
    () => {
      let result = await f()
      this.setState((prevState) => { ... },
        ...
      )
    })
  return result;
}

希望您明白我想要实现的目标。基本上我想得到result，这是从返回的值awaiting f，并将其返回handleSomething所以我可以在另一个地方使用它，但把它包裹在那些里面setState calls:

// g()
//   setState
//     res = f()
//       setState
//   return res

我的问题是，我怎样才能正确地做到这一点？也许我应该用结果值修改状态并从那里获取它？

EDIT:

的用法handleSomething:

// inside some async function
let result = await handleSomething()

您可以创建一个承诺，一旦两者都解决setState调用已完成：

function handleSomething() {
  return new Promise(resolve => {
    this.setState(
      prevState => {
        /*...*/
      },
      async () => {
        let result = await f();
        this.setState(
          prevState => {
            /*...*/
          },
          () => resolve(result)
          //    ^^^^^^^ resolve the promise with the final result
        );
      }
    );
  });
}

其用法如下：

this.handleSomething().then(result => /* ... */)

// or

const result = await this.handleSomething();