javascript - 从异步存储读取后无法分派(dispatch)操作

Question

这是我的代码

export const getAsyncStorage = () => async dispatch => {
    try {
        const asyncStorage = await AsyncStorage.getItem('settings');
        const asyncStorageObject = asyncStorage != null ? JSON.parse(asyncStorage) : null;
        console.log(asyncStorageObject) // this logs an object, as expected
        dispatch({ type: GET_ASYNC_STORAGE, payload: asyncStorageObject })
    } catch (e) {
        console.log('Error in getAsyncStorage writing to AsyncStorage', e)
    }
}

这是我得到的错误

Error in getAsyncStorage writing to AsyncStorage ReferenceError: payload is not defined

为什么会抛出“Payload not defined”？这对我来说没有任何意义。删除这一行

dispatch({ type: GET_ASYNC_STORAGE, payload: asyncStorageObject })

解决了。当我改变这一行时

dispatch({ type: GET_ASYNC_STORAGE, payload: asyncStorageObject })

到

dispatch({ type: GET_ASYNC_STORAGE, foo: asyncStorageObject })

我仍然收到相同的 payload 消息……不确定那是什么意思。以下是我如何写入 AsyncStorage:

export const writeAsyncStorage = () => async dispatch => {
    try {
        const settings = {...}
        await AsyncStorage.setItem('settings', JSON.stringify(settings));
        dispatch({ type: WRITE_ASYNC_STORAGE, payload: true, })
    } catch (e) {
        console.log('Error in onIntroDone writing to AsyncStorage', e)
    }
}

和reducer

import {
    GET_ASYNC_STORAGE,
    ...
} from '../constants/actions';

const initialState = {
    ...
    asyncStorage: {}
};

const settings = (state = initialState, action) => {
    switch (action.type) {
        ...
        case GET_ASYNC_STORAGE:
            return {
                ...state,
                asyncStorage: payload.asyncStorage
            }
        default:
            return state;
    }
}

export default settings;

Answer 1

在你的 reducer 中，你必须输入 action.payload 而不是 payload.asyncStorage