Questions tagged [rtk-query]

Redux toolkit query is for data and caching in a web application. It is an optional add-on in the Redux toolkit package.

RTK Query offers a set of powerful features that help developers handle common tasks related to data fetching, caching, and synchronization with the server. Some key features of RTK Query include:

  • Automatic API request generation: RTK Query generates API request endpoints based on a configuration object that defines the URL, method, headers, and other options. It eliminates the need to write boilerplate code for making API requests.

  • Automatic caching and invalidation: RTK Query automatically caches API responses, allowing subsequent requests for the same data to be served from the cache. It also provides mechanisms for cache invalidation when the data on the server changes.

  • Data synchronization: RTK Query handles data synchronization between the client and server, ensuring that the local data remains up-to-date with the server data. It supports background data fetching and real-time updates through WebSockets.

    Advanced data manipulation and normalization: RTK Query provides built-in support for data manipulation and normalization, allowing you to transform and shape the API responses before storing them in the cache.

  • Integration with Redux: RTK Query seamlessly integrates with Redux, leveraging the Redux store for storing the cached data and managing the state of ongoing API requests. It works well alongside other Redux Toolkit features, such as the Redux store, reducers, and middleware.

Overall, RTK Query aims to simplify the process of managing remote data in a Redux-based application by providing a standardized and efficient way to handle data fetching, caching, and synchronization.

You can learn more about RTK Query and its usage in the official documentation: RTK Query

948 questions
3
votes
1 answer

How to send array as parameter for RTK Query?

I want to send array as parameters like this: v1/product?main_category[]=3&main_category[]=4 my params : params.main_category = [1,2,3] my product slice: export const productsSlice = apiSlice.injectEndpoints({ endpoints: (builder) => ({ …
S.M_Emamian
  • 17,005
  • 37
  • 135
  • 254
3
votes
1 answer

Redux Toolkit Streaming updates - how to deal with relational entity adapters?

I am working on the chat that is utilising RTK Query with entity adapters. I currently have 2 different entity adapters; one for chat and one for messages. How can I go about selecting all messages for a specific chat? Do I need to store array of…
mnbxx
  • 55
  • 5
3
votes
2 answers

What's the difference between Redux Toolkit Query vs. Redux Toolkit

What can Redux Toolkit do, or do well in that RTK Query can't? I know that RTQ Query makes it easier to perform data fetching and caching with less code, but why do some projects that has Node.js and MongoDB as backend uses createAsyncThunk() from…
bltz
  • 213
  • 1
  • 4
  • 8
3
votes
1 answer

How to extract selectors from adapter from queries with arguments

I'm trying to extract selectors from queries in my apiSlice as said in this documentation: https://redux.js.org/tutorials/essentials/part-8-rtk-query-advanced The documentation put this example: const usersAdapter = createEntityAdapter() const…
3
votes
1 answer

Redux toolkit query mutation optimistic update

RTKQ I'm creating a mutation. I'm trying to update it with the optimistic update method, but in the examples I've found, the scenario is always like this. postEdit mutation works. getPost request is made in onQueryStarted and it is finalized. In my…
phoique
  • 97
  • 3
  • 7
3
votes
2 answers

How to define common query params in Redux Toolkit Query

All the endpoints of the API I'm working on, require the same set of query parameters. The user must select these parameters before making requests to endpoints. Examples of…
Mirco Bellagamba
  • 950
  • 6
  • 15
3
votes
1 answer

How to call endpoint.select() in RTK query with an argument to retrieve cached data (within another selector)?

I have an endpoint which accepts a parameter and I'm trying to access the cached data using endpoint.select() in a redux slice. The problem is i cant figure out how to pass in the cache key. I've done the following: export const selectProductsResult…
DannyMoshe
  • 6,023
  • 4
  • 31
  • 53
3
votes
2 answers

RTK Query hooks - preventing polling to auto refetch when arg change

I'm trying to refresh a token in a Query hook, with the polling feature every 9 seconds: "/App.tsx" .. ... const [storedToken, setStoredToken] = useState(getStoredToken()); const { data, error, refetch } = useRefreshUserQuery(storedToken, { …
Laurent
  • 119
  • 3
  • 6
3
votes
1 answer

RTK query interceptor multiple requests

I am having a problem with the RTK query interceptor, I implemented Automatic re-authorization by extending fetchBaseQuery​ per RTK query documentation and now I have a problem that if multiple requests get fired and the token is not valid all of…
Brixi
  • 51
  • 1
  • 8
3
votes
1 answer

How can I dynamically change the baseURL of my RTK Query api only for a specific group of injected endpoints?

How can I dynamically change the baseURL for specific resource whose RTK Query endpoints are injected via injectEndpoints? This is my use case: I have 4 resources which I have split (4 files) with RTK's injectEndpoints() functionality, which looks…
paullc
  • 155
  • 2
  • 9
3
votes
3 answers

How to refresh page after deleting an item using REDUX/RTK Query?

I am fetching data from my api using RTK Query like this export const coinApi = createApi({ reducerPath: 'coinApi', baseQuery: fetchBaseQuery({ baseUrl }), endpoints: (builder) => ({ getCoins: builder.query({ query: () =>…
deagleshot32
  • 81
  • 1
  • 8
3
votes
2 answers

RTK Query: Specifying error type per endpoint

Is there a way to specify error response per endpoint? Like we can specify Result & Request type when defining a query or mutation. I did went through the documentation and updated the base query. I am getting the generic success/error response…
Khubaib
  • 103
  • 4
  • 12
3
votes
2 answers

RTK Query With Next JS?

I am struggling to get my head around NEXT JS with RTK Query I'm trying to share data with multiple pages I just want one place where the data is added to the store so I am not making multiple calls. I want to call the query once and then access the…
NoobAndroid
  • 86
  • 4
  • 10
3
votes
1 answer

ReduxToolKit: correct way to use SelectFromResult options in a Query hook?

I am trying to understand how to correctly use SelectFromResult from the official documentation: https://redux-toolkit.js.org/rtk-query/usage/queries#selecting-data-from-a-query-result I have extended the Pokemon example to retrieve a filtered list…
Laurence Fass
  • 1,614
  • 3
  • 21
  • 43
3
votes
1 answer

RTK Query: Accessing cached data outside of a react component

We are in the process of integrating RTK query in our app. Our current "architecture" is as follow: All the business logic actions are written inside services which are plain JS classes. Those services are passed using react context in order for the…
Clement
  • 3,860
  • 4
  • 24
  • 36