您可以在 Redux Toolkit 中编写引用其他状态切片的选择器吗?

JCr*_*ine 3 reactjs redux redux-toolkit

我对 Redux/RTK 还很陌生,所以我仍在弄清楚。

情况:

favIds我有一个locationsSlice,它存储状态中的ids ( ) 数组。

我还有一个 ForecastSlice,它有一个对象数组 ( forecastObjects)。

我的问题:

我想编写一个全局选择器,它可以根据locationsSlice 中的id 返回过滤的预测对象。为此,我需要引用另一个切片的 state。做这个的最好方式是什么?

我可以为这样的逻辑编写一个钩子,但是有没有办法在切片内执行此操作?这是不好的做法吗?

JCr*_*ine 6

我能够通过createSelector 此处记录的RTK 内置功能来实现这一点。请告诉我这是否是反模式或其他什么。

// locationsSlice.js

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

// ...

const selectForecasts = (state) => state.locations.forecasts;
const favIds = (state) => state.user.favIds;

export const selectFavForecasts = createSelector(
  selectForecasts,
  favIds,
  (forecasts, ids) => {
    return forecasts.filter((forecast) => ids.includes(forecast.id));
  },
);
Run Code Online (Sandbox Code Playgroud)

  • 是的,这是正确的方法。选择器在 Redux 中是全局的,没有什么可以阻止你让选择器触摸不同的切片。在使用“filter”时最好使用“createSelector”,否则每次都会返回一个新的引用,这将创建大量无用的重新渲染。 (4认同)