react-query-questions
solid-query-questions
table-questions
virtual-questions
router-questions
react-charts-questions
ranger-questions
vue-query-questions
svelte-query-questions
bling-questions
form-questions
angular-query-questions
start-questions
db-questions
start-showcase
router-showcase
đź“Ł-announcements
Why doesn’t cache persist in React Native App ?
I couldn’t find much information on GitHub issues, blog posts, or YouTube videos
I’ve tried logging the results from async-storage using the default key of the react query cache as a troubleshooting step, but nothing ever comes back, always undefined
Here’s my query client config: https://pastebin.com/wMdcHxsz...
How to properly re-submit mutateAsync() with the same values
The scenario is as follows:
- User submits a form with some values
- API returns an error
- Show the error message on the UI
- User submits the form again as it is. <- How to properly do this? Just calling the mutateAsync() again doesn't work....
useQuery for search
Hi everyone! Was wondering if anyone could help me figure out the best way to implement a search page such as this with React Query.
I would like a controlled search bar that the top which the user can type into. Although I do not want it to search until they have clicked the search button, I do want to be showing results initial so I would like it to fire a query when the page mounts with the default value.
Below is the code I have managed to come up with. I am using derived state so that I can control the input and but not update the query key (this firing a new query) until the user clicks the search button. Is there a better solution than this which removes this bad practice?...
Isomorphic queries with useSuspenseQuery
This is borderline a Next question, but you all would probably know just as well if not better.
Streaming works incredibly well with ReactQueryStreamedHydration and useSuspenseQuery. That said, the isomorphic queries run by useSuspenseQuery raises an interesting problem. Any production system will need some sort of authentication token sent with the data requests.
With fetches from the browser, those headers / cookies will be sent along automatically (assuming you have credentials: include). But for fetches coming from the server, Next will require you to add whatever headers you need, presumably the cookie at the very least. ...
queryClient.ensureQuery and throwing to ErrorBoundary
Is there a way to make queries throw other things than Errors?
I'm using queryClient.ensureQuery with React Router's
loader like this:
```typescript
async function getFoo(foo: string) {...retry post request later on the application
Hello,
If my post request fails for some reason, I want retry it later on in the application with same data. Can someone point me to the right direction in the docs. Thanks....
Create a query that depends on another with solid-query
Hi,
I'm using solidjs and solid-query and my basic queries are working fine. I now need to run a second query based on the results of the first and I'm not sure how to structure that. I thought that the { get enabled() {...} } would do it but that does not seem to work. Has anybody seen an exmaple like this? Thanks in advance....
How to type a response from Next.js NextResponse.json() using useQuery and Supabase
I'm using React Query to call a route handler in Next.js, I return a response from Supabase like so:
```
// Route handler
export async function GET() {...
Returning a function from custom hook with useQuery
I have an api to retrieve a list of todos, and I want to create a helper to retrieve their names.
I ended up doing this:
custom hook:
```javascript...
Query returning incorrect cache data
Hi all,
I'm having some trouble with an API I'm hitting and React Query returning incorrect cached data and I'm not sure if I'm doing something wrong or not.
This is my custom hook for the call:
```...
Use Cache ReactQuery
I want to make requests to the server only when the cache is "stale," and otherwise, I want to use ReactQuery's cache. Every time I refresh the page, it makes a new request, and I don't want that. I want it to fetch data from ReactQuery's cache and only make a request to update the data when the cache expiration time is reached.
Class where the request code is located:
```javascript...
Set query data not working for optimistic updates
I'm using a mutation to add a question to a list of questions and I'd like to implement optimistic updates like in this guide (https://tanstack.com/query/v4/docs/react/guides/optimistic-updates).
My current mutation looks like this:
```
const mutation = useMutation({
mutationFn: createNodeMutation,...
Clearing query data without invoking a fetch
I have a resource that returns a 404 when it hasn't been previously created.
A mutation is invoked, which creates the said resource - and the original query then runs and returns the object after invalidating the query.
Another mutation performs a DELETE. Because I know a refetch would return a 404 - I'd prefer to prevent useQuery from refetching the data....
loading multiple component break the react query and throws an error 'QueryClient is not set'
```{
path: ":project",
loader: projectDataloader(queryClient),
element: (
<DashboardLayout>...
Getting http response code status in useQuery?
Hi there đź‘‹
I'm new in react/react-query I've just wanted to ask if is it possible to access the http response code with useQuery? I'm using useQuery to fetch data from an api and I wanted to display different error messages in case 403 and 401 response codes?
thanks!...
Cache not clearing with removeQueries()
I am calling
queryClient.removeQueries() before logging out. However, I still see the cache has data. What could I be doing wrong?single useQuery in multiple components
Hi Folks,
So as title says it's pretty straight forward I have a useQuery that fetch a pagination data
```jsx...
Reusing queries and queryKey variable evaluation
If I include a variable in a query (like the column id for a table) and the components are generated dynamically like so
```js
const checkNumber = useQuery({
queryKey: ['column', { type: 'exists' }, columnId],...
useQuery triggers before calling it?
Hi again, so I have a login function that takes some credentials and then passes it to a login mutation that send it to a "/login" endpoint, after that I extracted the "isLoading" property from the mutation and I use it for the query that gets the user, the thing is I want to make the query enabled only when that property is true.
=> Here is that line of code: enabled: !isLoading
But the query seems to trigger first thing when I get into the page, I tried making all the refetch properties to false like "refetchOnWindowFocus", "retry", "refretchInterval" and so on but it doesn't work.
Any tips guys 🙏...