React Redux：如何处理 RTK 查询/突变打字稿中的错误？

Question

我正在使用带有 RTK 突变的 Typescript，一切正常，但如果我以特定 JSON 格式从后端发送任何错误，例如：

{ 
   status: "Error",
   message "Something went wrong"
}

当我检查浏览器网络选项卡时，它会向我显示正确的错误响应，例如：

{
   data: { 
      status: "Error",
      message "Something went wrong"
    }
}

我在突变挂钩中遇到错误：

const [createCategory, {isLoading, error }] = useCreateCategoryMutation();

但我无法error.data.message在我的反应中访问它给我的类型错误，例如：

类型“FetchBaseQueryError | ”上不存在属性“数据” 序列化错误'。

Answer 1

此时，它可能是来自服务器的错误 ( FetchBaseQueryError) 或只是您编写的代码引发的任何错误（SerializedError例如query，在queryFn、transformResponse等中） - 并且可能具有完全不同的形状。

为了确保它是 a FetchBaseQueryError，只需执行以下操作

if ('data' in error) {
  // TypeScript will handle it as `FetchBaseQueryError` from now on.
}

Answer 2

我在这里也找到了Phry写的你的问题的答案:)，

如果您知道服务器的所有非 2xx 状态响应将返回的格式，您可以直接转换您的

fetchQuery as BaseQueryFn<string | FetchArgs, unknown, YourErrorType, {}>.