Axios React/Redux - 使用 thunk 动作创建器时不触发？答案

【问题标题】：Axios React/Redux - not firing when using thunk action creator?Axios React/Redux - 使用 thunk 动作创建器时不触发？
【发布时间】：2020-11-24 03:43:43
【问题描述】：

我正在尝试集成 thunk 以获得 redux 以允许 axios 对我拥有的后端 API 进行异步调用。

这是一个现有项目，正在转移到添加 redux 和 typescript。

由于某种原因，当使用这样的推荐 thunk 动作创建器时，我无法命中端点：

export const getAllCharacters = () => {
return (dispatch: Dispatch) => {
    axios.get(charactersAPI())
    .then(response => {
        dispatch(loadCharacters(response.data));
    })
}

}

如果我删除 return (dispatch) = () => {} 部分并让 axios 请求它工作并到达端点，但是我无法更新任何内容。

我已经安装了 thunk 并且似乎可以访问状态的其他部分没有问题，我只是无法触发这个异步部分。

商店：

const store = createStore(
appReducers, 
compose((window as any).__REDUX_DEVTOOLS_EXTENSION__ && (window as any).__REDUX_DEVTOOLS_EXTENSION__(),
applyMiddleware(thunk)));

我感觉这变得更加困难，因为我正在尝试同时转换为 typescript 并添加 redux。

任何帮助将不胜感激，谢谢。

【问题讨论】：

你怎么称呼这个动作getAllCharacters？你是怎么绑定到mapDispatchToProps函数里的？
呃，不，目前没有从 mapDispatchToProps 调用它。既然你提到它，那就很有意义了。
如果 store 通过dispatch 不知道该功能，那么middleware (thunk/saga) 将不会知道它。因此，它可能不会像预期的那样给出结果。记住应该有一个链接来连接事物:-)

标签： reactjs redux axios thunk

【解决方案1】：

尝试将getAllCharacters 包裹在mapDispatchToProps 中，如下所示

mapDispatchToProps = (dispatch: Dispatch) => ({
  getAllCharacters: (...) => dispatch(getAllCharacters(...))
})

【讨论】：