@tracio/vue 包封装了核心的 @tracio/sdk，并暴露出符合 Vue 3 习惯的原语：一个用于挂载 agent 的插件，以及一组以响应式 ref 形式向你返回访客 ID 和识别结果的组合式函数。
npm install @tracio/vue @tracio/sdkvue（3.4 或更新版本）是一个 peer dependency，默认你的应用中已经安装了它。
通过 app.use(TracioPlugin, options) 在你的应用实例上安装该插件。options 既可以接受扁平的配置（带 publicKey），也可以接受携带完整 TracioConfig 的 { config }。
// main.tsimport { createApp } from "vue"import { TracioPlugin } from "@tracio/vue"import App from "./App.vue"createApp(App) .use(TracioPlugin, { publicKey: import.meta.env.VITE_TRACIO_KEY }) .mount("#app")每个组合式函数都会返回对应 data、isLoading、error 和 isFetched 的 Vue ref，以及一个用于命令式（重新）拉取数据的 getData 方法。请注意：在每个 Vue 组合式函数上，这个命令式方法都叫 getData —— 不存在 React 风格的 getId。
返回稳定的访客标识符，以及加载状态和错误状态。
const { data, isLoading, error, isFetched, getData } = useVisitorId()// data: Ref<string | null> — the visitorId// getData(): Promise<void> — re-runs the underlying result fetch返回完整的 TracioResult（访客 ID 加上机器人检测）。opts.immediate 默认为 true；传入 { immediate: false } 可将拉取延迟到你调用 getData() 时再执行 —— 例如放在同意授权（consent）门槛之后。
const { data, isLoading, error, isFetched, getData } = useTracioResult()// data: Ref<TracioResult | null>一个逃生舱口（escape hatch），返回底层的 TracioInstance（如果组件上层没有安装任何插件，则返回 undefined），供高级用法使用。它直接返回该实例 —— 没有需要解构的包装对象。
const tracio = useTracio()// main.tsimport { createApp } from "vue"import { TracioPlugin } from "@tracio/vue"import App from "./App.vue"createApp(App) .use(TracioPlugin, { publicKey: import.meta.env.VITE_TRACIO_KEY }) .mount("#app")<script setup lang="ts">import { useVisitorId } from "@tracio/vue"const { data: visitorId, isLoading, error } = useVisitorId()</script><template> <span v-if="isLoading">Loading…</span> <span v-else-if="error">Error: {{ error.message }}</span> <span v-else>Visitor: {{ visitorId }}</span></template>@tracio/sdk API