能否在RTK Query内部发起依赖请求，无需外部传递参数？

我现有一个基于RTK Query的查询，当前该查询依赖另一个Axios请求返回的keys参数，目前是通过外部传入的方式调用useGetDataQuery。想咨询是否可以在RTK Query的query方法内部发起该依赖请求，直接使用其返回的数据作为参数，而非从外部传递。

相关代码示例：

const { data } = useGetDataQuery({
  keys // 该参数来自另一个请求
})

export const someApi = createApi({
  reducerPath: 'someApi',
  baseQuery,
  endpoints: (builder) => ({
    getData: builder.query<
      any,
      { keys: string[] }
    >({
      query: (arg) => {
        const { keys } = arg
        return {
          url: '/some_endpoint',
          params: {
            keys,
          },
        }
      },
    }),
  }),
})

当然可以实现，以下是两种常用的可行方案：

1. 自定义baseQuery实现链式请求 #

如果多个端点都需要依赖这个keys请求，推荐通过自定义baseQuery来统一处理。baseQuery支持返回Promise，你可以在这里先发起获取keys的请求，再将参数注入到后续的目标请求中：

// 自定义baseQuery，整合获取keys的逻辑
const customBaseQuery = async (args, api, extraOptions) => {
  // 先发起获取keys的请求
  const keysResponse = await axios.get('/get-keys-endpoint');
  const keys = keysResponse.data;

  // 给原请求参数添加上keys
  if (typeof args === 'string') {
    args += `?keys=${keys.join(',')}`;
  } else {
    args.params = { ...args.params, keys };
  }

  // 执行原baseQuery逻辑
  return baseQuery(args, api, extraOptions);
};

// 创建API时使用自定义baseQuery
export const someApi = createApi({
  reducerPath: 'someApi',
  baseQuery: customBaseQuery,
  endpoints: (builder) => ({
    getData: builder.query<any, void>({
      // 无需再外部传入参数
      query: () => ({
        url: '/some_endpoint',
      }),
    }),
  }),
});

2. 使用queryFn替代query（单端点场景推荐） #

如果只有当前这个端点需要依赖请求，更适合用queryFn。它支持完整的异步逻辑编写，能直接在内部发起多步请求：

export const someApi = createApi({
  reducerPath: 'someApi',
  baseQuery,
  endpoints: (builder) => ({
    getData: builder.query<any, void>({
      async queryFn(_args, api, extraOptions, baseQuery) {
        try {
          // 第一步：发起获取keys的请求
          const keysResult = await baseQuery('/get-keys-endpoint');
          if (keysResult.error) throw keysResult.error;
          const keys = keysResult.data;

          // 第二步：用拿到的keys发起目标请求
          const dataResult = await baseQuery({
            url: '/some_endpoint',
            params: { keys },
          });
          if (dataResult.error) throw dataResult.error;

          return { data: dataResult.data };
        } catch (error) {
          return { error };
        }
      },
    }),
  }),
});

// 调用时无需传入参数
const { data } = useGetDataQuery();

关键注意点 #

• 两种方案都会自动复用RTK Query的缓存、重试和状态管理机制，无需额外处理重复请求问题。
• 如果获取keys的请求需要依赖全局状态（比如鉴权token），可以通过api.getState()从Redux store中读取。
• 若keys需要缓存，可以单独将其封装为一个RTK Query端点，在queryFn中通过api.dispatch(someApi.endpoints.getKeys.initiate())调用，这样能直接复用该端点的缓存逻辑。

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