vue-query is a collection of hooks for fetching, caching and updating asynchronous data in Vue applications.
Basic Usage:
1. Import the vue-query.
import { defineComponent } from "vue"; import { useQueryProvider } from "vue-query"; export default defineComponent({ name: "App", setup() { useQueryProvider(); }, });
2. Use the query.
import { defineComponent } from "vue"; import { useQuery } from "vue-query"; export default defineComponent({ name: "MyComponent", setup() { const query = useQuery("todos", getTodos); return { query, }; }, });
3. Simple example.
const id = ref(1); const queryKey = reactive(["todos", { id }]); const queryFunction = () => getTodos(id); const options = reactive({ enabled: false, }); const query = useQuery(queryKey, queryFunction, options);
Preview:
Changelog:
v1.26.0 (08/23/2022)
- unref useQueries options
v1.25.2 (07/17/2022)
- bugfixes
v1.25.1 (07/14/2022)
- bugfixes
v1.25.0 (05/25/2022)
- bugfixes
- update query/core
v1.24.0 (05/19/2022)
- context sharing
v1.23.1 (05/15/2022)
- use generic TQueryKey in useQuery and useInfiniteQuery parameters
v1.23.0 (05/04/2022)
- use onScopeDispose instead of onUnmount in composables
v1.22.3 (04/08/2022)
- bugfixes
v1.22.2 (04/04/2022)
- use queryClient wrapper for provider and plugin
v1.22.1 (04/03/2022)
- bugfix
v1.22.0 (04/02/2022)
- update query core package
v1.20.1 (04/01/2022)
- bugfix
v1.20.0 (03/18/2022)
- reactivity aware wrappers for queryClient, queryCache and mutationCache
v1.19.3 (03/06/2022)
- bugfixes
v1.19.2 (03/05/2022)
- bugfixes
v1.19.0 (01/22/2022)
- plugin: replace useQueryProvider with VueQueryPlugin
v1.18.1 (01/21/2022)
- bugfix
v1.18.0 (01/18/2022)
- useQuery, useInfiniteQuery: deep watch for reactive arguments, deep unref options
v1.17.0 (01/18/2022)
- useQuery: make query options reactive by default
v1.16.2 (01/11/2022)
- Bugfix: useQueries: fix handling of queries update. Accept Ref as an argument
v1.16.1 (01/10/2022)
- Bugfix: query: make queries work with Refs in queryKey array
v1.16.0 (01/09/2022)
- export UseQueryReturnType, UseQueriesOptions, UseQueriesResults types
Download Details:
Author: DamianOsipiuk
Live Demo: https://vue-query.vercel.app/#/examples/simple
Download Link: https://github.com/DamianOsipiuk/vue-query/archive/refs/heads/main.zip
Official Website: https://github.com/DamianOsipiuk/vue-query
Install & Download:
# Yarn
$ yarn add vue-query
# NPM
$ npm i vue-query --save