Questions tagged [react-query]
React Query is hooks-based library for integrating data fetching into React function components
react-query
63
questions
196
votes
14
answers
243k
views
React-Query: How to useQuery when button is clicked
I am new to this react-query library.
I know that when I want to fetch data, with this library I can do something like this:
const fetchData = async()=>{...}
// it starts fetching data from ...
14
votes
2
answers
28k
views
react-query - How can I access my queries in multiple components?
I'm just beginning with react query and used it to get a list of books from the server using useQuery in my ListBooks Component
const { data, error, isLoading, isError } = useQuery("books", ...
96
votes
18
answers
148k
views
"Error: No QueryClient set, use QueryClientProvider to set one"
I was trying React Query and got this at the start of my React app.
import React from 'react'
import { useQuery } from "react-query";
const fetchPanets = async () => {
const ...
75
votes
9
answers
68k
views
What is the main difference between React Query and Redux?
currently I am using redux in different projects for state management. A few days back, I listened about react-query which is also used for state management and provides caching and async fetching. I ...
58
votes
2
answers
53k
views
Conditionally calling an API using React-Query hook
I am using react-query to make API calls, and in this problem case I want to only call the API if certain conditions are met.
I have an input box where users enter a search query. When the input value ...
34
votes
2
answers
43k
views
How to call useQuery hook conditionally?
Because of the Rules of Hooks, one shouldn't call hooks conditionally. So how does one fetch data conditionally using useQuery? For example, let's say I want to fetch data inside a functional ...
17
votes
2
answers
25k
views
How can I wait for mutation execution in React Query?
I have two API calls in onVerificationCodeSubmit that covering reset password logic. The problem is that newPasswordMutation executes before setRestorePasswordToken(data.restoreToken) in ...
15
votes
1
answer
16k
views
How to fetch user details only once
I have several components that make use of user details.
Since user details don't change that often, I want to fetch them only once.
One way would be -
const twentyFourHoursInMs = 1000 * 60 * 60 * 24
...
14
votes
4
answers
25k
views
Handling unauthorized request in react-query
I'm having problems using react-query. Whenever the response from the server is Unauthorized, useQuery is returning flags status='success' and isError=false. The server response status is 401 and the ...
14
votes
2
answers
40k
views
Manually refresh react-query onClick with React
When I refetch my query it goes into 'Updating ...' state when I have a onClick button but I want the query to refetch and show the 'Loading ...' state. My code is:
https://stackblitz.com/edit/react-...
13
votes
1
answer
16k
views
React Query: Can I use React Query for polling until I get certain data?
I want to implement long-polling until I get certain data from an API.
For example, let's say we have an API that returns the progress of a process.
And I want to call that API until the process is ...
5
votes
3
answers
8k
views
react-query useQuery not refetching after useMutation
I am using react-query (actually tanstack/react-query v4) to query from and mutate a db. Based on docs and research, I gather that useQuery will automatically refetch from the server if/when the ...
2
votes
1
answer
392
views
Server side pagination is not working as expected
I am developing a MERN stack app where I am trying to implement server side pagination.
Note that I am using React Query for managing server state.
On the root route, I display two posts.
When I ...
36
votes
22
answers
63k
views
Invalidate queries doesn't work [React-Query]
I'm trying to invalidate queries every times users press button "likes" to refresh all queries but without success so far despite following the docs.
I have a component that get data :
...
30
votes
1
answer
41k
views
react-query: onSuccess, onError, onSettled are deprecated. What should I use instead?
In this code snippet, when I hover over the onSuccess callback, it says that it's deprecated and will be removed in the next major version. The same happens with onError and onSettled callbacks. What ...