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
Vue composables pattern
Is it best to have a composable per query/mutation? Or a single composable that returns them all?
For example
```ts
export const useUserQueries = () => {...
setQueryData old data type
I'm not sure if I'm doing this correctly - but
old will always be defined - or will it? Should I have to account for old being undefined as per the type error? In what case would this be undefined?
Handling 404 on fetch
If I had a query, something like the below in my view user page
Where this will actual throw a 404 error, what would be the best way for me to redirect from the current page (UserView) back to the main table page (UserIndex)? Probay important to note that
const { data: user } = userQueries.getUser('1234'); // just a basic query to get the user based on the prop
const { data: user } = userQueries.getUser('1234'); // just a basic query to get the user based on the prop
userQueries comes from a composable outside of the component...When using KeepAlive
I'm experimenting with KeepAlive - is it possible to trigger a network fetch on
activated ?Some best practices guidelines and advice with Vue
I've only recently started using this package (not sure if I should call it vue-query or react-query) but I just wanted to know best practices in terms of query keys and data...
1. Should we try to re-use queries from composables? Or should queries be more specific to the component itself?
2. When typing the keys for the query, should the query key expect multiple
Ref<> values from the component when the query is created or should my composable return these refs to the component?
3. Is it better to use ref or reactive for query key values?...useMutation implementation question
Sorry for similar name as the last question, but this is entirely different.
In the useMutation implementation I can see this code:
watch(...
useMutation question
I am currently trying to replicate this react hook and confused about the intended functionality.
link to the hook:
https://github.com/wagmi-dev/wagmi/blob/main/packages/react/src/hooks/accounts/useConnect.ts
...
vue-query hooks can only be used inside setup() function
I have been using
solid-query to get effect. Have a project in Vue and wanted to add the Vue version.
Started with
foo.vue...how to implement dev tools for vue query
I installed the @tanstack/vue-query and making requests normally however I’m wondering how can I implement it in the dev tools, I already have the vue plugin for dev tools. Also a weird thing happening is that when I connect to a localhost api the query is there in the tools , but if it’s a remote api it doesn’t show.
What could cause a queryKey reactive variable change to be detected by useQuery but not run queryFn?
I have a dropdown created with https://headlessui.com/ in a child component. The default dropdown item (first in list) is a 'no filters' option that will modify the request when a different option is selected. For some reason when a different option is selected, and then the 'no filters' option is chosen again, the queryFn does not run again to retrieve a fresh query even though the selected dropdown item is in the queryKey. The select function does run but neither the onSuccess nor queryFn. Log...
What is the return type of useQuery?
I have a composable that runs useQuery and specifies a return type of: UseQueryReturnType<TypedMaterial[], unknown>
I get the error "TS2322: Type 'UseQueryReturnType<TypedMaterial[], unknown>' is not assignable to type 'UseQueryReturnType<TypedMaterial[], unknown, QueryObserverResult<TypedMaterial[], unknown>>"
When I change the return type to UseQueryReturnType<TypedMaterial[], unknown, QueryObserverResult<TypedMaterial[], unknown>>
I get the error "TS2322: Type 'UseQueryReturnType<TypedMaterial[], unknown>' is not assignable to type 'UseQueryReturnType<TypedMaterial[], unknown, QueryObserverResult<TypedMaterial[], unknown>>'."...
How to convert a complex json response?
I use vue-query to get a very complex json from an endpoint. The {data} received is an array of complicated objects containing other objects and array of objects.
The data is a reactive object. I need to transform this complicated object into completely different format so that I can show it in a tree format. This tree format data also needs to be reactive.
Do I need to convert my reactive response to a plain JSON, do my transformation and then convert it back into a reactive format? What's the best strategy to do this?...
How to implement a request is dependent on data from another request?
If a request is dependent on data from another request, should a useQuery call go inside another queryFn with a relevant queryKey that will be passed through to the nested useQuery call?
How to run useQuery with watch
I am receiving error "Error: vue-query hooks can only be used inside setup() function."