Questions tagged [react-query]
React Query is hooks-based library for integrating data fetching into React function components
react-query
1,825
questions
0
votes
0
answers
14
views
Why does React handle a 401 error at updateDehydratedSuspenseComponent?
Problem
In the Developer Tools Network tab, all requests are 2xx success.
I can get Valid data from server
But, 401 error occurs.(this api is not mocked api.)
react-dom.development.js:17497 ...
- 121
1
vote
1
answer
16
views
useQueries loses the ability to query data in parallel because Next.js requires server component to be async
The app is running by Next.js.
I have a useQueries hook:
const userQueries = useQueries({
queries: user.contacts.map((contactId: string) => ({
queryKey: ['contact', ...
- 33
1
vote
1
answer
9
views
What do these numbers represent in React Query Devtools?
I've been wondering what these numbers represent in React Query Devtools. I searched online, but I can't find it's meaning.
I thought cache ID. But I see duplicates. The total number of rows with the ...
- 1,148
0
votes
0
answers
67
views
React Query v3 to v4
We are trying to migrate from react. query v3 to react query v4.
Following same code is working differently in v3 and v4.
Basically,
We have a custom hook which uses useMutation to do update in ...
- 13.2k
4
votes
1
answer
41
views
React query - force querying new data for a new object id
I'm using react query to fetch data on a blog post, according to its Id. When I visit a certain blogpost and then navigate to another one, it first presents me the data from the previous blogPost, and ...
- 43
1
vote
1
answer
27
views
Getting this error "no overload matches this call" using "useInfiniteQuery" with React
I need help figuring out why my code isn't working and I keep getting this error:
No overload matches this call.
Overload 1 of 3, '(options: DefinedInitialDataInfiniteOptions<FetchResponse<...
- 13
0
votes
0
answers
36
views
React Query queryClient.setQueryData isn't updating the cache data
I have a custom hook that looks something like this:
export const useDeleteAccount = () => {
const queryClient = useQueryClient();
const result = useMutation(
async (accountId: any) => {
...
- 13.2k
0
votes
1
answer
32
views
Tanstack-Query Caching Not Working When Calling fefetch
I'm using @tanstack/react-query in my React Native (Expo) & Firebase project. I have set everything necessary (such as QueryClientProvider). For an unknown reason chrome networking tab doesn't ...
-1
votes
0
answers
18
views
How can I use mutationfn with a reusable API file
import axios from "axios";
const axiosInstance = axios.create({
baseURL:"https://jsonplaceholder.typicode.com"
})
class APIClient<T> {
endpoint: string
constructor(...
- 13
0
votes
0
answers
25
views
React-query sometimes render with no uses value and i don't know why
I try to make infinite scroll. And i found out sometime react query fetch twice. for example, it should fetch only second page, but some time fetch second and third pages. (I'll call this a bug in the ...
0
votes
0
answers
36
views
⨯ TypeError: react__WEBPACK_IMPORTED_MODULE_2__.useContext is not a function
I am working on a Next.js project where I am using TRPC and React Query for data fetching. However, I am encountering a TypeError: useContext is not a function error. Here is my setup:
TRPC Client ...
-1
votes
0
answers
28
views
Does useFormState/useActionState React hook handle multiple requests gracefully like TanStack react-query?
TanStack react-query does a good job handling scenarios where the same request is made multiple times before getting a response.
Does React's useActionState (originally called useFormState) hook ...
- 647
1
vote
0
answers
30
views
How to build an isomorphic API client with dynamic headers in next js?
I have a next js application with a separate API. All API endpoints require a specific X-HOST request header. I want to prefetch requests on the server side and sometimes invalidate them on the client ...
0
votes
0
answers
29
views
Why does my handle click not working when resetting field to empty?
I created an update function wherein there is a specific function in my radio button wherein if the user selected no/none it will reset the other form into empty string or make it null, but the ...
- 577
-4
votes
0
answers
41
views
I need help about how should use mutation fn in the react project [closed]
I am new in coding and try to learn react.
I try to usemutation hook for my component and in this I need a mutation fn, where I face this Error:
No overload matches this call.
The last overload gave ...
- 13
0
votes
0
answers
30
views
Why do I get empty array at first render and then click other date before the data shows?
I'm having a little bit of problem on rendering the initial data for the current date, in my system I have a calendar wherein the first thing it will select is the current date, and it should show the ...
- 577
0
votes
1
answer
46
views
Error "Expected 1-2 arguments, but got 3" in useQuery with React Query and TypeScript
I am using useQuery from React Query in my React Native project to fetch live scores. I want to pass three arguments: the query key, a fetch function, and an options object. However, I am encountering ...
- 139
0
votes
2
answers
31
views
How to update from mutations in React Query to avoid extra Network requests?
I have a React 18 application and using React Query.
When I use queryClient.invalidateQueries({ queryKey: ['anecdotes'] }); after the PUT request that causes the change, the application makes a new ...
- 866
0
votes
0
answers
23
views
JWT auth using react-query and next 14 for frontend and custom Django backend
so iam working on a CMS project using next14 as the front-end and python for the custom backend "backend colleague"
the backend takes credintials and send my 2 httponly cookies in response &...
1
vote
1
answer
123
views
Is it ok to call setQueryData from within onSuccess?
We have just migrated from react query v3 to react query v4. Official react query document to migrate mentions onSuccess is no longer called from setQueryData.
This is from the official documentation.
...
- 13.2k
0
votes
0
answers
15
views
NextJS Server Component Data Mutation
'use server';
import TirestockComponent from '@components/TirestockComponent';
import { fetchTirestock } from '@nextapi/fetchTirestock';
export default async function UsedTirestock() {
const ...
0
votes
0
answers
17
views
React Query wont invalidate and re-fetch at the initial mutation call. but if I defocus my browser window and focus again, it starts working correctly
I have a react query problem. the very first edit I submit does not invalidate the data. but if I defocus and refocus the browser window it starts invalidating correctly after each mutation without ...
- 1
0
votes
0
answers
20
views
Getting an empty object in data for updates
Im working on updating a document in my mongodb, the document has a field, which is an object that has other fields attached to it, I have 1 field i want to update, the others should stay the same, ...
- 966
0
votes
0
answers
43
views
How to use react query data in another component without moving state up?
I am using nextjs + typescript + react-query. Currently my app has an input that asks a user for a url, which is then used to fetch a list of github issues. Here are the simplified versions of the ...
- 33
0
votes
0
answers
14
views
TypeScript Type Error When Transforming API Response Format to Different Format Using Select in useInfiniteQuery
Custom Hook Call
const { data } = useListInfiniteQuery({
searchText: SearchText,
dateRange: dateRange,
select: getListItems,
});
Select Function
function getListItems({
pageParams,
pages,
}:...
- 1
0
votes
0
answers
29
views
getServerSideProps with ReactQuery doesn't cache properly
im using nextjs 14.2.3 (page router) with react query, and my data is not cached when im trying to call an api on the server with getServerSideProps with reactQuery.
when ever i change my route, the ...
0
votes
0
answers
63
views
React query not updating data even after refetch shows new data from api
I am using react query to fetch a list of items. After creating a new item, I am calling refetch on my query to get the updated list. I see a new api call is made, and the new item I just created is ...
- 10.3k
-2
votes
1
answer
55
views
Is React Query more efficient compared to using hooks? [closed]
Is React Query more efficient compared to using useEffect and useState, given that these hooks are built-in and easy to use? If so, why choose React Query?
Why is React Query more efficient than hooks ...
1
vote
1
answer
70
views
Querying data with React Query and React Table causes page crash
I'm developing an app with React Query and React Table but table seems to break when I change the query key, thus causing the website to crash.
I opened an issue on their GH but I still have no ...
- 1,965
0
votes
0
answers
55
views
Tanstack react query. isLoading is always true for dependent query on subsequent requests
I am using react-query. I have a mutation and 2 queries where the second query depends on the data from the first query. This means that if I invalidate the first query, the second query is also ...
