Redux 返回承诺答案

【问题标题】：Redux return promiseRedux 返回承诺
【发布时间】：2018-01-08 04:29:24
【问题描述】：

我有一个简单的注销功能（仅用于测试），我想在操作完成时通知用户。首先想到的是用承诺来做到这一点。

我试过这样，但它有问题。我不太明白这些是如何工作的。我可以这样做还是有更好的方法？

功能

logOut = () => {
    this.props.logoutUser().then((passed) => {
        if (passed) {
            alert("You are now logged out!");
        }
    });
};

退出操作

export function logoutUser() {
    return dispatch => {
        new Promise(function (resolve, reject) {
            dispatch(logout()).then((response) => {
                return true;
            }).catch((error) => {
                return false;
            });
        });
    }
}

function logout() {
    return {
        type: "LOGOUT"
    }
}

【问题讨论】：

你的方法是正确的。确保您使用的是 thunk 中间件并且您的 thunk 返回 Promise。
我应该让 thunk 工作，因为我将它与包含“获取”的其他操作一起使用。这次我想在没有'fetch'的情况下使用它:)
这是相同的方法，因为fetch 也返回一个 Promise。如果您的 thunk 将返回 Promise，您将能够在组件中使用它 (return new Promise...)。
写logoutUser是一个函数返回一个函数，返回函数返回undefined。
此外，您很可能会忘记new Promise(...) 和所有true/false 业务。如果如您的代码所示，dispatch() 返回一个承诺，只需返回它。回到调用者，成功的注销将带你走承诺的成功路径，失败则走错误路径。

标签： javascript reactjs promise redux react-redux

【解决方案1】：

您也可以使用 callback 来执行此操作，就像这样 -

logOut = () => {
  this.props.logoutUser(result => {
    if (result.success) {
      alert("You are now logged out!");
      return;
    }

    // Handle error
  });
};

export function logoutUser(callback) {
  logout()
    .then(() => callback({ success: true }))
    .catch(error => callback({ error }));

  return dispatch => {
    dispatch({
        type: "LOGOUT"
    });
  };
}

function logOut() {
  // log out function that returns a promise
}

【讨论】：

【解决方案2】：

注销功能问题

export function logoutUser() {
    return dispatch => {
        new Promise(function (resolve, reject) {
            dispatch(logout()).then((response) => {
                resolve(true); // changed
            }).catch((error) => {
                reject(error);  // changed
            });
        });
    }
}

你必须通过回调函数resolve 成功，reject 失败。参考这个link

更新：其次你必须使用thunk中间件，才能像dispatch一样工作Promise对象：github

【讨论】：

我仍然收到错误“Uncaught TypeError: Cannot read property 'then' of undefined”:(