使用Thunk中间件调度组件

问题描述

我正在开发一个应用程序中实现Redux，需要发布到API来对用户进行身份验证。我遵循了Redux文档，了解如何将Redux与TypeScript一起使用，并且工作正常。我已经实现了自定义中间件（Thunk）以使用异步任务，并且工作正常。但是，如果我想将状态映射到道具，则无法直接从消费者处分派动作。到目前为止，这是我的代码的样子：

ThunkAction的类型文件：

export type AppThunk<ReturnType = void> = ThunkAction<
  ReturnType,RootState,unknown,Action<string>
>

---

thunk.ts：

...
export const thunkFetchAuthenticatedUser = (): AppThunk => async dispatch => {

dispatch(
    fetchUserReqeust()
)

return await axios.get('apilink')
.then((response) => {
    dispatch(
        fetchUserSuccess({
            payloda: response.data.user
        })
    )
})
.catch((err) => console.log(err))
}
...

---

我对特定提取操作如下：

export function fetchUserReqeust(){
    return {
        type: FETCH_USER_REQUESTED
    }
}

export function fetchUserSuccess(user: any){
    return {
        type: FETCH_USER_SUCCESS,payload: user
    }
}

现在在我的组件中，如果我只是从thunk文件中导入特定的方法，则可以获取它。但是，如果我想将状态映射到道具，则似乎存在问题。我的映射代码如下：

const mapState = (state : RootState) => ({
    isAuthenticated: state.auth.isAuthenticated
})

const mapDispatch = (dispatch: ThunkDispatch<RootState,void,Action>) => {
    return {
      fetchAuthenticatedUser: () => dispatch(thunkFetchAuthenticatedUser()),};
  }

const connector = connect(mapState,mapDispatch);

type ReduxProps = ConnectedProps<typeof connector>


type ProviderProps = ReduxProps & {
    store: any
}

mapDispatch const源自this github issue。现在我得到的错误是：错误：

动作必须是普通对象。使用自定义中间件执行异步操作。

我需要在mapDispatch中进行哪些更改才能使我的调度正常工作？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）