Query won't refresh when new instances of the query mount
seanbruce opened this issue · 10 comments
Which @ngneat/query-* package(s) are the source of the bug?
query
Is this a regression?
No
Description
Hi, I'm long time react-query user who recently join an angular development team. Very excited to see your library to come.
However, I noticed that query won't refresh when new instances of the query mount when I build my todos app demo here.
I use *ngIf to conditionally render todo list component. when the list component mounted again, the data in the cache showd in the component but no refetch is sending.
Please provide a link to a minimal reproduction of the bug
No response
Please provide the exception or error you saw
No response
Please provide the environment you discovered this bug in
No response
Anything else?
No response
Do you want to create a pull request?
No
It's because it's cached.
With react-query, when new component that use useQuery mounted, the data cached in queryClient with the same key in useQuery will returned for rendering and at the time refetching new data at the background. from the users pecpective, they saw cached data immediately and will see content update if the refetching return different data. The cache behavior is the same for angular query, but not the refetching behavior.
In your react application, could you try setting in the global query config the staleTime to Infinity and tell me if it still works the same?
After setting staleTime to Infinity, the query won't refetch on re-mounted. so, In my Angular application, after setting the stateTime of useQuery to 0, it will refetch automatically when component re-mounted.
getTodos() {
return this.#useQuery(
['todos', 'list'],
() => {
return getTodos();
},
{ staleTime: 0 }
);
}
In according to the reference of useQuery in the docs, staleTime is default to 0. I wondered why the default is different in angular query, just curious.
It's just a hunch based on my usage. But now I wonder if it's better to leave the default as react-query to avoid future discussions like this.
Now I also wonder if it's the same issue here - #56
Can you check it with staleTime set to 0, please?
Sure, and after setting options like this
getTodos() {
return this.#useQuery(
['todos', 'list'],
() => {
return getTodos();
},
{ staleTime: 0, refetchOnWindowFocus: true }
);
}
The query still won't refrech on windows focus. no matter refetchOnWindowFocus set to true or "always".
Thanks. I'll remove the default staleTime that we set.
@NetanelBasal Thanks for your response. I'll close this issue.
Done