RTK Query中useGetDomainsQuery与initiate差异及Selector取不到数据问题

核心问题 #

RTK Query 的 select() 方法需要与调用 initiate 时完全一致的参数来匹配缓存中的数据条目。你当前的 selectDomainsResult 没有传入参数，导致它查找的是无参数调用的缓存条目，而你用 dispatch(api.endpoints.getDomains.initiate(...)) 时传了参数，所以找不到对应数据。

分步解决 #

1. 修改结果选择器，支持传入参数 #

把 selectDomainsResult 改成接受参数的函数，这样能匹配不同参数组合的缓存：

export const selectDomainsResult = (params) => api.endpoints.getDomains.select(params);

2. 调整数据选择器，适配带参数的查询 #

更新 selectDomainsData，让它能接收参数并传递给结果选择器：

import { createSelector } from '@reduxjs/toolkit';

export const selectDomainsData = createSelector(
  [(_, params) => params, (state) => state],
  (params, state) => {
    const domainsResult = selectDomainsResult(params)(state);
    return domainsResult?.data;
  },
);

3. 在组件中使用带参数的选择器 #

在组件里传入和调用 initiate 时完全相同的参数，确保缓存匹配：

// 定义和调用initiate时一致的参数
const queryParams = {
  search: search || '',
  status: status || '',
  page_number: pageNo,
  page_size: pageRow,
};

// 获取数据
const domainsData = useSelector(state => selectDomainsData(state, queryParams));
// 使用适配器转换数据
const domains = useSelector(state => {
  const data = selectDomainsData(state, queryParams) ?? initialState;
  return domainsAdapter.getSelectors().selectAll(data);
});

额外注意事项 #

• 确保 initialState 是 domainsAdapter.getInitialState() 的返回值，而非自定义的空数组，适配器依赖特定的数据结构（包含 ids 和 entities）。
• 调用 initiate 时的参数要和选择器传入的参数完全一致，包括空值处理（比如 search 为空时用 '' 而非 undefined），否则缓存条目不匹配。
• 如果场景允许，优先使用 useLazyQuery 替代 dispatch(initiate)，它是 RTK Query 专门为手动触发查询设计的 API，能自动处理缓存匹配和状态更新。

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