类型“ ThunkAction”的参数无法分配给类型“ AnyAction”的参数

时间:2020-02-04 01:47:45

标签: typescript redux react-redux redux-thunk

我已经使用如下打字稿设置了redux thunk函数:

export const fetchActivities = (): AppThunk => async dispatch => {
    dispatch(fetchActivitiesRequest())

    try {
        const res = await fetch("/activities")
        const body = await res.json()

        dispatch(fetchActivitiesSuccess(body))
    } catch (err) {
        dispatch(fetchActivitiesError(err))
    }
}

AppThunk只是从ThunkAction类型派生的类型,具有以下类型参数:

export type AppThunk<ReturnType = void> = ThunkAction<ReturnType, {}, null, Action<string>>

我的问题是,当我尝试为我的动作设置单元测试时,以及当我尝试分派这样的重击动作时:

const middlewares = [thunk]
const mockStore = configureMockStore(middlewares)
const store = mockStore({ activities: [] })

store.dispatch(actions.fetchActivities())

我收到以下错误消息:

Argument of type 'ThunkAction<void, {}, null, Action<string>>' is not assignable to parameter of type 'AnyAction'.
  Property 'type' is missing in type 'ThunkAction<void, {}, null, Action<string>>' but required in type 'AnyAction'.ts(2345)

尽管没有成功,但我一直在尝试寻找解决此问题的方法。大多数建议都说尝试向泛型添加任何参数以进行分发,因此dispatch<any>(actions.fetchActivities())。尽管这样做可以防止键入错误,但是只会调度thunk中的第一个操作,而try和catch语句中的所有内容都将被忽略。

有人对如何解决此问题有任何建议吗?

1 个答案:

答案 0 :(得分:3)

这是两个不同的问题。任何方式的打字都不会影响运行时的行为。

首先:因此,不执行任何其他操作的重击只能具有一种含义:对dispatch的其他调用很可能从未实现。 您确定对fetch的呼叫是否终止?它可能会永远等待答案或类似的东西。

第二,您的键入问题:普通的Dispatch类型默认不支持thunk。用Dispatch<any>解决方案是可以的。否则,您可以将dispatch函数从ThunkDispatch包中强制转换为redux-thunk

编辑:对不起,这看上去就像RTK错误一样,只是有些不同。 (原始答案可能错误)

这是RTK中的一个已知错误,其中有一个currently open PR可以解决此问题-由于我当时生病了,所以我没有解决这个问题,但是直到我们把推出新版本。您可以通过

进行安装

yarn add https://pkg.csb.dev/reduxjs/redux-toolkit/commit/933aa4a1/@reduxjs/toolkit 要么 npm i https://pkg.csb.dev/reduxjs/redux-toolkit/commit/933aa4a1/@reduxjs/toolkit