Typescript联合和类型保护

Question

使用RTK Query从error中获取SerializedError的最好方法是什么，如下面的示例：https://redux-toolkit.js.org/rtk-query/usage/error-handling。另外，有没有为单个查询键入错误的示例？提前感谢

function PostsList() {
  const { data, error } = useGetPostsQuery()
  // error: FetchBaseQueryError | SerializedError | undefined
  // Property 'status' does not exist on type 'FetchBaseQueryError | SerializedError'.
  // How do I check if it's a FetchBaseQueryError before continuing
  return (
    <div>
      {error.status} {JSON.stringify(error.data)}
    </div>
  )
}

Answer 1

最简单的方法是"status" in error

{ "status" in error ? <>{error.status} {JSON.stringify(error.data)} </> : undefined }

不支持为单个查询键入错误。不过，这种情况在未来可能会发生变化。

但一般来说，有许多与baseQuery相关的错误通常独立于端点响应而发生，例如fetchBaseQuery解析错误或连接错误。

https://github.com/reduxjs/redux-toolkit/blob/8a5d4bc69beca497625da48954fc1f2621bb0c82/packages/toolkit/src/query/fetchBaseQuery.ts#L61-L99