使用RTK Query时，如何向createSelector传递查询参数？

你的问题核心是RTK Query的endpoint.select()是参数化selector，必须传入查询参数（这里是date）才能定位到对应缓存数据，之前的写法没有传递参数，导致selector找不到匹配的查询结果，返回undefined。

修正后的Selector写法 #

方式1：简洁的参数化Selector #

直接让selectChartData接收state和date参数，调用带参数的select()方法：

export const selectChartData = (state, date) => {
  // 传入date参数，定位到该日期对应的查询缓存
  const chartResult = extendedChartApiSlice.endpoints.getChart.select(date)(state);
  // 可选链处理，避免查询未完成时的报错
  return chartResult.data;
};

方式2：Reselect记忆化参数化Selector #

如果需要利用Reselect的记忆化特性（避免不必要的重计算），可以这样写：

export const selectChartData = createSelector(
  // 定义依赖：接收state和date，返回带参数的查询结果
  (state, date) => extendedChartApiSlice.endpoints.getChart.select(date)(state),
  // 从查询结果中提取data
  (chartResult) => chartResult.data
);

组件中使用Selector #

在组件里通过useSelector传入date参数即可：

const chartData = useSelector(state => selectChartData(state, date));

进阶：直接提取标准化数据 #

如果需要直接获取entities或ids，可以进一步封装：

// 获取标准化后的实体对象
export const selectChartEntities = createSelector(
  (state, date) => extendedChartApiSlice.endpoints.getChart.select(date)(state),
  (chartResult) => chartResult.data?.entities
);

// 获取ID列表
export const selectChartIds = createSelector(
  (state, date) => extendedChartApiSlice.endpoints.getChart.select(date)(state),
  (chartResult) => chartResult.data?.ids
);

注意事项 #

• 必须传入与useGetChartQuery(date)一致的date参数，才能匹配到对应的缓存数据；
• 使用可选链（?.）处理chartResult.data，避免查询处于loading或error状态时出现Cannot read properties of undefined报错。

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