如何阻止Redux RTK查询在出错时重试

gopyfrb3  于 2022-11-12  发布在  其他
关注(0)|答案(3)|浏览(128)

我有一些请求可能会返回404。当它们这样做时,RTK查询将发送重试,导致数百个失败的请求。为什么它试图在错误时重新获取?我该怎么办?

1zmg4dgp

1zmg4dgp1#

如果您的端点出错,RTK Query的useQuery将在两种情况下发送请求:

  • 您更改了参数(这将始终导致一个新请求)
  • 您使用useQuery挂载了一个组件。

因此,在没有看到代码的情况下,我会假设您的组件以某种方式重新挂载,从而在挂载后导致另一个请求。

kfgdxczn

kfgdxczn2#

您可以通过使用端点内的属性maxRetries来限制rtk自动执行的重试次数。

import { createApi, fetchBaseQuery, retry } from 
'@reduxjs/toolkit/query/react'

// maxRetries: 5 is the default, and can be omitted. Shown for 
documentation purposes.
const staggeredBaseQuery = retry(fetchBaseQuery({ baseUrl: '/' }), {
  maxRetries: 5,
})
export const api = createApi({
  baseQuery: staggeredBaseQuery,
  endpoints: (build) => ({
    getPosts: build.query({
      query: () => ({ url: 'posts' }),
    }),
    getPost: build.query({
      query: (id) => ({ url: `post/${id}` }),
     extraOptions: { maxRetries: 5 }, // You can override the retry behavior on each endpoint
    }),
  }),
})

export const { useGetPostsQuery, useGetPostQuery } = api
e5nqia27

e5nqia273#

正如文档所说,对于自定义错误处理,我们可以使用queryFn
使用不同错误处理行为的一次性查询
因此,如果出于任何原因,您希望缓存出错时的请求,您可以执行以下操作:

getPokemon: build.query<Pokemon, string>({
  async queryFn(name, api, extraOptions, baseQuery) {
    const result = await baseQuery({
      url: `https://pokeapi.co/api/v2/pokemon/${name}`,
      method: 'GET'
    });

    if (result.error?.status === 404) {
      // don't refetch on 404
      return { data: result.data as Pokemon };
    }

    if (result.error) {
      // but refetch on another error
      return { error: result.error };
    }

    return { data: result.data as Pokemon };
  }
}),

相关问题