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
0
votes
1 answer

How to type a wrapper function in RTK Query?

I was looking into how I could have the return type be different based on the query args passed into the hook. I stumbled into this answer and it suggested adding a wrapper function and deciding what the return type is ourselves. I wasn't…
LoyalPotato
  • 401
  • 4
  • 15
0
votes
2 answers

Using validateStatus on RTK Query baseApi

Our API returns a 200 for all responses and includes an errorCode field in the response. The RTK Query docs show that you can use validateStatus on your individual queries for this use case. But is there a way to bake that into your base API…
Jonathan Tuzman
  • 11,568
  • 18
  • 69
  • 129
0
votes
1 answer

Why RTKQ use*Query returns cached data if refetch fails with 404 error

I'm using RTK Query to GET some data initial GET request returns 200 OK with some data in some minutes data on server is deleted I have refetchOnFocus enabled so my GET request is repeated in some time and now it returns 404 error But use*Query…
0
votes
1 answer

How to use baseQuery outside of createApi in redux-toolkit

In order to reduce my app size, I want to remove axios from my redux-toolkit async thunks. Also, I would like to use my baseQuery function, since it has the global headers of my application. My current async thunk (using axios): export const…
Rashomon
  • 5,962
  • 4
  • 29
  • 67
0
votes
2 answers

Refresh token with Redux Toolkit Query

First of all I'll start with the snippet that you can find on rtk official documentation webpage. import { fetchBaseQuery } from '@reduxjs/toolkit/query' import { tokenReceived, loggedOut } from './authSlice' const baseQuery = fetchBaseQuery({…
Arcadiusz
  • 11
  • 1
  • 2
0
votes
1 answer

Use Redux Offline with RTK-Query

Has anyone been successful in marrying Redux Offline with RTK Query? I'm unsure how to decorate RTK query mutations with offline metadata, as described in the RTK Query docs: const registerUser = (name, email) => ({ type: 'REGISTER_USER', …
cseelus
  • 1,447
  • 1
  • 20
  • 31
0
votes
1 answer

Redux RTK reloading state when calling getSelectors

I am new to Redux RTK so the problem might not exactly be on calling getSelectors(). However, when I'm using the state that comes from getSelectors() it reloads the entire state. Problem The baseline is that I have different Setup objects that I'm…
Oriol
  • 45
  • 5
0
votes
1 answer

Getting the type error while selecting Values from Result of Query

I was writing the logic of selecting Values from a Result of the Query and I faced an error. I tried to tackle it by myself, but end up with no success. What I did: I got from the query an array of objects. There is the array of what was got: [ { …
Alex Kor
  • 65
  • 1
  • 9
0
votes
1 answer

How to type provideTags in redux-toolkit (many items endpoint)

Following code works well, however I dont manage to type providesTags correctly: type Post = { id: number, name: string, description: string, } const postsApiSlice = api.injectEndpoints({ endpoints: (builder) => ({ getPosts:…
Rashomon
  • 5,962
  • 4
  • 29
  • 67
0
votes
1 answer

RTK Query with Date- Range Picker, avoid unnecessary renders and abide rule of hooks

I have a timecard component that in use could have large amounts of data per user and so it does not make sense to fetch the data until a date-range is supplied. With RTK Query, a hook is used to make the api call (e.x. {data: timecards, isLoading,…
Jowz
  • 399
  • 1
  • 3
  • 16
0
votes
1 answer

Unable to delete or add data in firestore using RTK-Query in react

I am trying to achieve delete and add functionality in react using RTK-Query with firestore. It sound might be weird that I am using RTK Query to perform firestore operation in React. So, I have written service API file to delete and add operation…
James
  • 371
  • 3
  • 12
0
votes
2 answers

Why using a createSelector function in another file causes re-render vs creating "inline", both with useMemo

I have this app that I'm working on that is using RTK and in the documentation for selecting values from results, in queries using RTK Query, they have an example with a createSelector and React.useMemo. Here's that code and the page import {…
LoyalPotato
  • 401
  • 4
  • 15
0
votes
1 answer

RTK Query useMutation is missing "reset" method?

In the docs it says that useMutation returns a tuple whose second value is the "mutation result" object, and that that object includes: reset - A method to reset the hook back to it's original state and remove the current result from the cache But…
Jonathan Tuzman
  • 11,568
  • 18
  • 69
  • 129
0
votes
1 answer

rtk query doesn't update api data

I'm using rtk query to fetch data and show in component. I can see data is coming and i can get data in frontend. Here is the values i get from query , const { currentData, isFetching, isError } = useListStudentQuery() It put it on Home.js and…
Rajanboy
  • 2,266
  • 2
  • 8
  • 15
0
votes
1 answer

rtkQuery update cache

I did not understand how to update the cache without additional requests in the component, in this case I call endpoint getEntity so that the cache key endpoint getEntity + arg is assigned to each entity in the code. I wrote a simple example Now I…
i like Cola
  • 277
  • 6
  • 15