安装
你可以通过 NPM 安装 Vue Query。
NPM
Shell
1npm i @tanstack/vue-query或
Shell
1pnpm add @tanstack/vue-query或
Shell
1yarn add @tanstack/vue-query或
Shell
1bun add @tanstack/vue-queryVue Query 兼容 Vue v2.6+ 和 v3.3+。
如果你使用的是 Vue 2.6,请确保同时安装 @vue/composition-api
想在下载前先试用?可以尝试 基础 示例!
Vue Query 初始化
在使用 Vue Query 前,你需要使用 VueQueryPlugin 进行初始化。
TypeScript
1import { VueQueryPlugin } from '@tanstack/vue-query'2 3app.use(VueQueryPlugin)在 <script setup> 中使用组合式 API
我们文档中的所有示例均采用 <script setup> 语法。
Vue 2 用户可通过 此插件 使用该语法。请查阅该插件的文档以了解安装详情。
如果你不喜欢 <script setup> 语法,可轻松将所有示例转换为标准的组合式 API 语法:只需将代码移至 setup() 函数内,并返回模板中所使用的值即可。
HTML
1<script setup>2import { useQuery } from '@tanstack/vue-query'34const { isPending, isFetching, isError, data, error } = useQuery({5 queryKey: ['todos'],6 queryFn: getTodos,7})8</script>9 10<template>...</template>