javascript - 在带有异步调度的react-native中使用redux-thunk

Question

我在我的react-native代码中设置了redux-thunk。

在mapDispatchToProps中我有:

const mapDispatchToProps = dispatch => {
     return {
         login: (state, navigator) => dispatch({
             type: "USER",
             payload: loginFunc(state, navigator)
          }),
     }'
}

登录函数是一个 firebase 函数，它返回一个 promise 链，最终返回我需要的对象。

但是，在我的 reducer 中，我的有效负载看起来像是一个 promise 或一些时髦的对象。它看起来像:

{ 
     a: someVal, 
     b: sommeOtherVal, 
     c: someMoreVal,
     ...ValsUpToI.
     i: {
       // The values I actually need show up
     }

这让我很困惑，因为当我尝试执行 payload.myValue 时，我的 redux 状态为 undefined 。我认为只执行 payload.i 也不安全，因为这可能是一些 promise 或 async 问题，对吧？我以后很可能会成为其他人吗？

Answer 1

使用异步操作方法来执行基于 Promise 的函数 API 调用，如 redux documentation 中所述。 .

const mapDispatchToProps = dispatch => {
 return {
     login: (state, navigator) => {
         return loginFunc(state, navigator).then(
             response => dispatch({
                 type: "USER",
                 payload: response
             }),
             error => console.log('An error occurred.', error)
        )
     }
 }

这样您就可以调用基于 Promise 的函数并正确利用响应或错误。