javascript - Action 必须是普通对象。使用自定义中间件

Question

会出现什么问题？

Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.

配置商店:

export default configureStore = () => {
  let store = compose(applyMiddleware(ReduxThunk))(createStore)(reducers);
  return store;
}

行动

export const menulist = async ({ navigation  }) => {
  return async dispatch => {
    try {
        dispatch({ type: types.MENULIST_REQUEST_START })
        let response = await menuListByCategories();
        dispatch({ type: types.MENULIST_SUCCESS })
    } catch (error) {
        dispatch({ type: types.MENULIST_FAILED })
    }
  }
}

Answer 1

你的使用方式不对

在 Redux 中，每个操作都必须返回一个对象，这是必须的! 所以，你的调度，它是一个函数，应该这样调用。

此外，您只需要声明返回调度的函数 async 即可。 async 关键字决定以下函数将返回一个 Promise。由于您的第一个函数(菜单列表)返回第二个函数(调度函数)返回的 promise ，因此您不必指定它。

export const menulist = ({ navigation  }) => async (dispatch) => {
    try {
        dispatch({ type: types.MENULIST_REQUEST_START })
        let response = await menuListByCategories();

        dispatch({ type: types.MENULIST_SUCCESS })
    } catch (error) {
        dispatch({ type: types.MENULIST_FAILED })
    }
  }
}