使用TypeScript与RTK Query处理Post请求响应排序时遇“Object is from type unknown”错误的类型定义咨询

嘿，这个问题我之前也碰到过！TypeScript报“Object is of type unknown”是因为RTK Query默认会把接口返回的响应推断为unknown类型，它不知道你返回的数组里每个元素的结构，所以直接访问a.id和b.id就会触发类型检查错误。下面给你一步步解决的方案：

第一步：定义响应数据的类型接口 #

首先，你需要明确后端返回的单篇文章的结构，把它定义成TypeScript接口：

// 根据你的实际接口返回字段补充，这里是示例
interface Post {
  id: number;
  title: string;
  content: string;
  // 其他字段比如发布时间 createdAt: string 之类的
}

第二步：在transformResponse中指定类型 #

接下来有两种方式让TypeScript识别响应的类型，选一种就行：

方式一：直接给transformResponse的参数指定类型 #

修改你的transformResponse代码，显式告诉TypeScriptres是Post[]类型：

transformResponse: (res: Post[]) => res.sort((a, b) => b.id - a.id)

方式二：在query的泛型中声明返回类型 #

在定义RTK Query的endpoint时，通过泛型指定该query的返回类型为Post[]，这样transformResponse里的res会自动推断为正确类型：

// 假设你是在createApi里定义的endpoint
getPosts: builder.query<Post[], void>({
  query: () => ({
    url: '/your-post-api',
    method: 'POST' // 你的POST请求配置
  }),
  transformResponse: res => res.sort((a, b) => b.id - a.id)
})

特殊情况：如果后端返回嵌套结构 #

要是你的接口返回的是类似{ code: number, data: Post[] }的嵌套结构，那你需要先提取出数据数组再排序：

// 先定义嵌套响应的类型
interface PostResponse {
  code: number;
  data: Post[];
}

// 然后在transformResponse里处理
transformResponse: (res: PostResponse) => res.data.sort((a, b) => b.id - a.id)

这样处理后，TypeScript就能正确识别响应数据的结构，不会再报unknown的错误，同时也能正常实现按id降序排序，让最新的文章排在最前面啦～

内容的提问来源于stack exchange，提问作者Micromina