如何在 rtk 查询中定义错误数据返回的类型？答案

【问题标题】：how can I define a type for error data return in rtk query?如何在 rtk 查询中定义错误数据返回的类型？
【发布时间】：2022-01-18 17:27:46
【问题描述】：

我使用 rtk 查询，但此内容出现类型错误：

Property 'data' does not exist on type 'FetchBaseQueryError | SerializedError'.
  Property 'data' does not exist on type 'SerializedError'

这是我写的代码：

const { data, isError, isSuccess, isLoading, error } = useGetClerkListQuery({
        page,
        count: value,
        order_by: orderBy,
        search: searchTerm,
    })
    
    if (isError && error) {
        toast.error(error.data.status.message)
    }

这也是我的 rtk 突变：

getClerkList: builder.query<{ result: IClerkList }, IClerkParamsType>({
            query: params => {
                return {
                    url: '/clerk/list/',
                    params,
                }
            },
            providesTags: ['clerk'],
        }),

【问题讨论】：

请提供最小可重现示例
@captain-yossarian 你需要什么信息？此错误发生在 if 条件下的 error.data 上
为了帮助你，我想重现这个错误。我将更容易修复和发布我的代码作为答案，因为我将能够对其进行测试。没有可重现的例子，我只能猜测这里发生了什么。

标签： reactjs typescript next.js redux-toolkit rtk-query

【解决方案1】：

您需要先将错误类型缩小到 FetchBaseQueryError：

if (isError && error && 'status' in error) {

但一般注意，从服务器返回的数据将是unknown，您必须验证它是否具有正确的结构，然后手动转换它。毕竟这是一个错误，因此意外的东西也可能有错误，因此它可能具有意外的结构。

【讨论】：