动作必须是普通对象。将自定义中间件用于异步功能。反应原生

Posted 2023-02-19

【中文标题】动作必须是普通对象。将自定义中间件用于异步功能。反应原生

【英文标题】：Action must be plain objects. Use custom middleware for async function. React Native

【发布时间】：2018-02-22 05:14:58

【问题描述】：

我从组件中调用 getLocalToken 操作，该操作从 AsyncStorage 读取字符串。以下是我调用函数的方式。

componentWillMount() 
            this.props.getLocalToken();
            console.log("CWM", this.props.auth);
        

以下是我的操作

export const getLocalToken = async () => 
    try 
        const localToken = await AsyncStorage.getItem('@auth:localToken');
        const mobileNumber = await AsyncStorage.getItem('@auth:mobileNumber');
    
    catch (e) 
        console.log('Failed to read token', e);
    



    return (dispatch) => 
        console.log("get token");
        dispatch(
            type: types.GET_LOCALTOKEN_SUCCESS,
            payload:  localToken: this.localToken, mobileNumber: this.mobileNumber 
        );
    

对于这段代码，我得到 Action 必须是普通对象。为异步功能使用自定义中间件。错误。

【问题讨论】：

错误消息似乎很自我描述，似乎是什么问题？

我不明白，因为我是 javascript 和 React Native 的新手

改写错误消息，默认操作不支持异步操作。如果你想让你的动作异步，你需要使用自定义中间件，一个常用的选项是Redux Thunk。

【参考方案1】：

Actions 是纯 JavaScript 对象。操作必须具有指示正在执行的操作类型的 type 属性。类型通常应定义为字符串常量。请阅读 redux 文档了解更多信息。

如果您想要异步请求或其他副作用，您必须使用middleware。最受欢迎的是：

redux-thunk redux-saga redux-observable

它们都以不同的方式处理异步请求。 Redux-thunk 对初学者很友好，但在我看来，对于复杂的项目和测试来说很痛苦。