RTK查询中提供缓存失效标签有什么区别？

Question

我正在按照官方文档学习RTK查询。但是，我不确定这样进行缓存失效有什么区别

 getUsers: build.query<User[], void>({
      query: () => '/users',
      providesTags: ['User'],
    }),

还有这个

 providesTags: (result, error, arg) =>
        result
          ? [...result.map(({ id }) => ({ type: 'Post' as const, id })), 'Post']
          : ['Post'],

医生解释了

 For more granular control over the provided data, provided tags can have an associated id. This enables a distinction between 'any of a particular tag type', and a specific instance of a particular tag type'.

但是，我不知道这意味着什么。同样的

invalidatesTags

Answer 1

在第一种情况下，您提供硬编码的标签名称来获取用户。假设在用户下您想要显示他们的帖子，并且您还有“添加帖子”按钮来发送突变以添加帖子。如果我们传递硬编码标签而不是函数，会发生什么

providesTags: ['Post'],

当我们为查询提供标签时，每个查询都会获得一个类似于 id 的标签名称。因此，当我们向服务器发送带有

ADD POST

突变的post请求时，我们将

invalidatesTags:["Post"]

传递给突变，因此突变完成后，突变将去寻找具有

'Post'

标签名称的查询，它会认为查询现在已过时，因此它将再次使用提供的标签运行该查询，并且您的应用程序商店将填充新数据。这就是使缓存失效的工作原理。

假设您的页面上有 10 个用户，并且您单击了 User-1 的

Add a Post

按钮。它将运行“ADD POST”突变，然后它将查找提供的“POST”标签，并使该查询无效并重新获取数据。在您的情况下，为 User-1 运行突变，将为所有 10 个用户运行获取查询，因为所有用户帖子获取查询都标记有“Post”。但是您仅更改了 User-1 的帖子，因此您应该仅重新获取 User-1 帖子查询。

这就是为什么我们传递一个函数，以便我们可以

DYNAMICALLY

定义标签名称。该函数需要 3 个参数：（错误 ar 很明显）

result

是商店里的帖子。

arg

是您调用查询时传递的参数。假设您已调用

getUserPostQuery(user)

，您可以使用

user

 在函数内访问此 

arg

providesTags: (result, error, arg) =>
        // i believe it should have been `arg.id`. otherwise id would be undefined. we are fetching user's post
       // result would be the user's posts
        result
          ? [...result.map(({ id }) => ({ type: 'Post' as const, id:arg.id })), 'Post']
          : ['Post'],

因此我们动态地将标签名称定义为

  { type: 'Post' as const, id:arg.id }

您必须使用相同的函数签名定义

invalidatesTags

属性才能创建要失效的动态标签名称。

通过此实现，如果您现在更改 User-1 的帖子，redux 将仅为 User-1 运行 get 查询。