RTK 查询使用 getState() 从另一个切片获取状态

Question

我昨天刚开始使用 redux，在阅读了不同的库之后，我决定使用 RTK 的切片路由。

对于我的异步，我决定使用 RTK 查询而不是使用 createAsyncThunk，我对从另一个切片访问状态的正确方法有疑问。

slice1 包含一些用户数据，例如：

export const initialState: IUserState = {
   name: 'example',
   id: null,
};

在我的 slice2 中，我有一个函数想要做类似 getSomethingByUserId(id) 和我当前的实现：

interface IApiResponse {
  success: true;
  result: IGotSomethingData[];
}

const getsomethingSlice: any = createApi({
  reducerPath: 'api',
  baseQuery: fetchBaseQuery({
    baseUrl: 'https://someapibase',
  }),
  endpoints(builder) {
    return {
      fetchAccountAssetsById: builder.query<IApiResponse, null>({
        query() {
          console.log('store can be called here', store.getState().user.id);
          return `/apipath?id=${store.getState().user.id}`;
        },
      }),
    };
  },
});

export default getsomethingSlice;
export const { useFetchAccountAssetsByIdQuery } = getsomethingSlice;

当我在某处读到 markerikson 提到导入商店但在 thunk 中使用 getState 不是好的做法时，我环顾四周并在 documentations 中看到存在用于查询的 getState onStart 与 thunk 不同，您可以从它的第二个参数访问它。

有人对此有 onStart 实现吗？还是可以接受导入商店？

Answer 1

一般来说，我们想阻止人们这样做，这就是为什么你在那里没有 getStore（你在许多其他地方都有）。

您看，RTK-query 使用您提供给查询的参数来确定缓存键。由于您没有传入参数，因此结果的缓存键将存储为 fetchAccountAssetsById(undefined).

因此，您提出了第一个请求，state.user.id 是 5，并且提出了该请求。

现在，您的 state.user.id 更改为 6。但是您的组件调用 useFetchAccountAssetsByIdQuery() 并且已经有 fetchAccountAssetsById(undefined) 的缓存条目，因此它仍在使用 - 并且没有请求制作完成。

如果您的组件改为调用 useFetchAccountAssetsByIdQuery(5) 并且它更改为 useFetchAccountAssetsByIdQuery(6)，RTK 查询可以安全地识别它具有 fetchAccountAssetsById(5) 的缓存条目，但没有 fetchAccountAssetsById(6) 并将发出新请求，检索最新信息。

因此，您应该 select 使用 useSelector 在您的组件中使用该值并将其作为参数传递到您的查询挂钩中，而不是将其从您的 query 中的商店中取出函数。

RTK 查询使用 getState() 从另一个切片获取状态

RTK Query get state from another slice using getState()

reactjs

redux

redux-thunk

redux-toolkit

rtk-query