如何从我的商店获取 RTK 查询生成的数据?

Jim*_*ers 7 reactjs redux react-redux redux-toolkit rtk-query

我正在使用一个非常基本的 RTK 查询挂钩从 API 获取一些用户数据。如何访问组件内商店中保存的数据?我无法从 RTK 查询在特定事项中生成的存储中获取数据。

我有一个简单的 Post API,我调用了 getPosts 挂钩。在 Redux devtools 中,我可以看到来自我商店中 RTK 查询挂钩的数据:

发布API

import { createApi, fetchBaseQuery } from '@rtk-incubator/rtk-query';

export interface Post {
  id: number;
  name: string;
  fetched_at: string;
}

type PostsResponse = Post[];

export const postApi = createApi({
  reducerPath: 'postsApi',
  baseQuery: fetchBaseQuery({ baseUrl: '/' }),
  entityTypes: ['Posts'],
  endpoints: (build) => ({
    getPosts: build.query<PostsResponse, void>({
      query: () => 'posts',
      provides: (result) => [
        ...result.map(({ id }) => ({ type: 'Posts', id } as const)),
        { type: 'Posts', id: 'LIST' },
      ],
    }),
  }),
});
Run Code Online (Sandbox Code Playgroud)

调用 hook 后帖子保存在商店中

在此输入图像描述

phr*_*hry 7

getPosts最简单的方法是在每个需要数据的组件中调用钩子。它将使用缓存中的数据并且不会发出额外的请求 - 但如果您稍后在没有父组件的情况下安装该组件,或者在数据尚不存在的另一个上下文中,它将发出请求。

因此,您可以保证始终掌握数据。