Skip to main content

Installation

您可以通过NPM安装 Vue Query。

NPM​

$ npm i @tanstack/vue-query
# or
$ pnpm add @tanstack/vue-query
# or
$ yarn add @tanstack/vue-query

Vue Query 兼容 Vue 2.x 和 3.x。

如果您使用的是 Vue 2.6，请确保还使用了 @vue/composition-api

Vue Query 初始化​

在使用 Vue Query 之前，您需要使用 VueQueryPlugin 进行初始化。

import { VueQueryPlugin } from "@tanstack/vue-query";

app.use(VueQueryPlugin);

使用 <script setup> 和 Composition API​

我们文档中的所有示例都使用 <script setup> 语法。

Vue 2 用户也可以使用该语法，需要使用 此插件。请查阅插件文档以获取安装详细信息。

如果您不喜欢 <script setup> 语法，您可以通过将代码移动到 setup() 函数中并返回模板中使用的值，轻松将所有示例转换为普通的 Composition API 语法。

<script setup>
import { useQuery } from "@tanstack/vue-query";

const { isLoading, isFetching, isError, data, error } = useQuery({
  queryKey: ["todos"],
  queryFn: getTodos,
});
</script>

<template>...</template>