How can you invalidate cache for specific queries?

Question

Accepted Answer

RTK Query allows fine-grained cache invalidation using dynamic tags. Instead of invalidating all queries under a single tag, you can target specific queries by assigning tags that include unique identifiers such as item IDs. **Dynamic Tags:** Use functions in **`providesTags`** and **`invalidatesTags`** to attach tags dynamically based on query results (e.g., `['Post', id]`). **Item-Level Invalidation:** When a mutation affects only one record, invalidate only that specific tag to trigger a refetch for the corresponding query. **Programmatic Invalidation:** Use the **`api.util.invalidateTags()`** method to manually invalidate specific tags from within components or middleware. import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'; export const postsApi = createApi({ reducerPath: 'postsApi', baseQuery: fetchBaseQuery({ baseUrl: '/api' }), tagTypes: ['Post'], endpoints: (builder) => ({ getPost: builder.query({ query: (id) => `/posts/${id}`, providesTags: (result, error, id) => [{ type: 'Post', id }], }), updatePost: builder.mutation({ query: ({ id, ...data }) => ({ url: `/posts/${id}`, method: 'PUT', body: data, }), invalidatesTags: (result, error, { id }) => [{ type: 'Post', id }], }), }), }); In this example, each post query is tagged with its own unique ID. When a specific post is updated using the `updatePost` mutation, only the query with that post’s ID is invalidated and refetched. This prevents unnecessary network calls for unrelated data. import { useDispatch } from 'react-redux'; import { postsApi } from './services/postsApi'; const RefreshPost = ({ id }) => { const dispatch = useDispatch(); return ( ); }; This manual approach allows you to invalidate specific queries directly from your component, offering precise control over what data should be refetched. Using dynamic and targeted tags ensures that RTK Query refetches only the necessary data, optimizing performance and keeping the cache consistent.

How can you invalidate cache for specific queries?

How can you invalidate cache for specific queries?

Scenario Questions

Follow-up Questions