isLoading with initalData
I tried to get ‘isLoading’ and ’status’ from useQuery hook and always I got false on isLoading and the status - “success” although it’s was first fetch.
After some checks I found that because i define ‘initalData’ on querycllient cause to this problem.
How I can set initial data to all queries and also get the isLoading status?
8 Replies
optimistic-gold•3y ago
Placeholder Query Data | TanStack Query Docs
What is placeholder data?
Placeholder data allows a query to behave as if it already has data, similar to the initialData option, but the data is not persisted to the cache. This comes in handy for situations where you have enough partial (or fake) data to render the query successfully while the actual data is fetched in the background.
conscious-sapphireOP•3y ago
Placeholder also act the same
optimistic-gold•3y ago
ah yeah just realized that as well. You can either use
isFetching instead of isLoading, or use this approach: https://github.com/TanStack/query/issues/1712#issuecomment-770093572GitHub
When placeholderData is set, initial status is success · Issue #171...
Describe the bug When placeholderData is set, initial status is success To Reproduce Example: https://codesandbox.io/s/react-query-placeholder-data-h7hz4?file=/src/App.js Expected behavior From doc...
conscious-sapphireOP•3y ago
I know this solve but, I looking for something that can define global like initaldata and not define in each data that return from the hook
rare-sapphire•3y ago
The point if initialData / placeholderData is to show it instead of a loading spinner. It's a feature that it's in success state. What's the use-case for having it in loading state?
conscious-sapphireOP•3y ago
I will give an example to the use-case:
I fetch tasks from my server using useQuery hook, now I want to render the length of the tasks to the screen, but because it’s take time to data to arrive it’s throw me error because I can’t access ‘length’.
I use this in many places on my app
When I set ‘initialData’ to be empty array in queryclient it’s solve the error in every time I use ‘tasks.length’.
I know that I can do this: ‘tasks?.length’ and it’s solve my problem… but I need to this in every place
rare-sapphire•3y ago
Okay thats fine, but why do you need it to be in loading state then? If the answer is : because I want to display a fallback ui while it's loading, then you can also access .length after that isLoading check
I mean the middle ground is probably to use placeholderData and then check via isPlaceholderData...
conscious-sapphireOP•3y ago
Ok is solve my problem