1

我正在尝试设置连接的反应路由器和 RTK 查询的减速器。
（旧代码库已经连接了反应路由器）
然后我收到了这个错误。

设置connectRouter失败

Type 'Reducer<RouterState<unknown>, AnyAction>' is not assignable to type 'Reducer<unknown, AnyAction>'.
Types of parameters 'state' and 'state' are incompatible.
Type 'unknown' is not assignable to type 'RouterState<unknown>'.

我的“mockApi”很简单。“orderApi”有点相同。

export const mockApi = createApi({
  reducerPath: "mockupPath",
  baseQuery: fetchBaseQuery({ baseUrl: "http://jsonplaceholder.typicode.com" }),
  endpoints: (builder) => ({
    getPost: builder.query<MockResonse, number>({
      query: (id) => `/posts/${id}`,
    }),
  }),
})
interface MockResonse { userId: number, id: number, title: string, body: string, }

虽然使用 combineReducers 不会产生类型错误，

reducer: combineReducers({
  router: connectRouter(history),
  [mockApi.reducerPath]: mockApi.reducer,
}),

但我失去了商店的类型。
知道商店的类型在开发中是一个巨大的优势，所以我试图弄清楚如何解决这个错误。

我可以知道我在哪里错了吗？

4

2 回答 2

1

似乎您可以在此处使用类型断言。
https://github.com/supasate/connected-react-router/issues/195

router: connectRouter(history) as Reducer,
于 2022-02-13T16:02:59.013 回答
1

connected-react-router与较新版本的history和一起使用时会发生此 TypeScript 错误react-router。

该connectRouter函数的类型如下所示：

export function connectRouter<S = LocationState>(history: History<S>)
    : Reducer<RouterState<S>>

（来源）

您可以看到它是一个泛型函数，其中泛型类型参数S指的state是存储在您的历史记录中的类型。

如果你有新版本history(5.2+)，那么History<S>现在是 TypeScript 错误，因为接口History不再是 generic。这是最近history在5.2.0 版中发布的更改。

connectRouter您可以通过将函数调用的泛型类型参数显式设置为unknown：

router: connectRouter<unknown>(history)

const store = configureStore({
  reducer: {
    [mockApi.reducerPath]: mockApi.reducer,
    router: connectRouter<unknown>(history)
  }
})

路由器减速器的推断类型现在是Reducer<RouterState<unknown>, AnyAction>.

于 2022-02-13T23:47:12.520 回答