如何在异步函数中使用 setState

Question

我是运行这个代码：

.then((url) => {
      if (url == null || undefined) {
          return this.props.image;
      } else {

          const { image } = this.props;

          //entryUpdate is an action creator in redux.
          this.props.entryUpdate({ prop: 'image', value: url })
               .then(() => {
                   this.setState({ loading: false });
               });

但我收到以下错误：

如何在动作创建者之后调用的异步函数内格式化 setState()？

如有任何帮助，我们将不胜感激！

Answer 1

我将 .then() 函数放在 if 语句中。但应该是这样的：

.then((url) => {
    if (url == null || undefined) {
      return this.props.image;
    } else {
      const { image } = this.props;
      this.props.entryUpdate({ prop: 'image', value: url })
    }
 })
        .then(() => {
            this.setState({ loading: false });
        });

Answer 2

为了使其正常工作，您的动作创建者 this.props.entryUpdate 需要 return 对其正在进行的异步工作作出承诺。查看错误消息，目前似乎并非如此。

您还需要注意，当组件在 promise 解析时已经卸载时，在异步回调中调用 setState() 可能会导致错误。

一般比较好的方法大概是使用componentWillReceiveProps等待新值流入组件然后触发setState。

如何在异步函数中使用 setState

How to use setState in an asynchronous function

asynchronous

setstate

reactjs

react-native

redux-thunk