Redux Toolkit Query+TypeScript：transformResponse类型错误求解

你的代码片段 #

...
getPosts: builder.query<PostsResponse[], void>({
    query: () => GET_POSTS,                       
    transformResponse: (response: PostsResponse[], meta, arg): Posts[] => {
        return converPostsForUi(response)
    }
}),
...

编译错误信息 #

Type 'Posts[]' is not assignable to type 'PostsResponse[] | Promise<PostsResponse[]>'.    
Type 'Posts[]' is not assignable to type 'PostsResponse[]'. 
Type 'Posts' is missing the following properties from type 'PostsResponse': id, created, updated, version, and 4 more.  
endpointDefinitions.d.ts(53, 5): The expected type comes from property 'transformResponse' which is declared here on type 'Omit<EndpointDefinitionWithQuery<void, BaseQueryFn<string | FetchArgs, unknown, FetchBaseQueryError, {}, FetchBaseQueryMeta>, PostsResponse[]> & { ...; } & { ...; } & QueryExtraOptions<...>, "type"> | Omit<...>'

错误含义拆解 #

• 第一行：transformResponse的返回值类型Posts[]，不符合RTK Query要求的PostsResponse[]或Promise<PostsResponse[]>类型。RTK Query明确期望这个方法返回PostsResponse[]（或其异步版本），但实际返回了Posts[]。
• 第二行：进一步明确Posts[]与PostsResponse[]类型不兼容，无法相互赋值。
• 第三行：指出类型不兼容的具体原因：Posts类型缺少PostsResponse类型定义的id、created、updated、version等至少4个属性，二者结构完全不匹配。
• 第四行：说明这个返回类型要求来自transformResponse的属性定义源头——你在builder.query<PostsResponse[], void>中指定的第一个泛型参数，RTK Query会以此作为该查询最终返回值的预期类型。

问题本质 #

你在定义查询时，通过builder.query<TResult, TArg>的第一个泛型参数指定了最终返回类型为PostsResponse[]，但transformResponse却返回了Posts[]，二者类型结构不匹配，触发TypeScript类型校验报错。

内容的提问来源于stack exchange，提问作者four-eyes