vueuse-shared-skilld

@vueuse/shared 15.0.0

与框架无关的 Vue 响应式工具。对等依赖项 vue ^3.5.0 （package.json:40）。仅支持 ESM："type": "module"，且 dist 中没有 CJS 构建版本 （package.json:2）。要求 Node.js >= 22（package.json:37）。

类似 dist/index.js:904 的源码引用指向已准备好的软件包源码。 函数文档：https://vueuse.org/<functionName>。

v15 关键规则

• v15.0.0 中，useThrottleFn 的 trailing 默认值从 false 改为 true。 现在的默认值为 ms = 200, trailing = true, leading = true, rejectOnCancel = false （dist/index.js:904）。发布说明：https://github.com/vueuse/vueuse/releases/tag/v15.0.0 如需获得 v14 仅触发前沿的行为，请显式传入 trailing = false。
• computedEager / eagerComputed 已弃用，计划移除。 请改用 Vue 3.4+ 的 computed（dist/index.d.ts:5-18）。
• watchPausable / pausableWatch 的所有重载均已弃用。 请使用 Vue 内置的 watch，其句柄已包含 pause() 和 resume() （dist/index.js:1021, dist/index.d.ts:1459-1466）。
• 优先使用主要名称，而非已弃用的别名；参见 migration-v15 中的表格。
• 定时器组合式函数在服务器上不执行任何操作：useIntervalFn 和 useTimeoutFn 仅在 isClient 时启动定时器（dist/index.js:1654, dist/index.js:1726-1729）。

常见任务

import { useDebounceFn, useThrottleFn } from '@vueuse/shared'

// Debounced fn: returns a promise; cancel/flush/isPending attached
const search = useDebounceFn(query => fetchApi(query), 300, { maxWait: 1000 })

// Rate-limit scroll/resize; v15 fires on BOTH edges by default
const onScroll = useThrottleFn(handler, 200)          // leading + trailing
const onScrollV14 = useThrottleFn(handler, 200, false) // trailing=false, v14 style

import { until, whenever } from '@vueuse/shared'

// One-shot async flow control instead of manual watchers
await until(isReady).toBe(true, { timeout: 5000, throwOnTimeout: true })

// Runs only while truthy; { once: true } auto-stops after the first run
whenever(isReady, data => render(data), { once: true })

import { createInjectionState } from '@vueuse/shared'

// Typed provide/inject pair without manual InjectionKey
const [useProvideStore, useStore] = createInjectionState(() => {
  const count = ref(0)
  return { count, inc: () => count.value++ }
}, { defaultValue: { count: ref(0), inc: () => {} } })

import { refManualReset, syncRef } from '@vueuse/shared'

const message = refManualReset('idle')   // message.reset() restores 'idle'
const num = ref(10), str = ref('10')
syncRef(num, str, {                       // transform is required when
  transform: {                            // types differ (type-level check)
    ltr: v => String(v),
    rtl: v => Number(v),
  },
})

更多示例模式：reactivity-utilities、 watch-utilities。

如何选择状态共享工具

工具	生命周期	适用场景
createGlobalState	应用生命周期内，永不释放（dist/index.js:169-180）	整个应用范围内的单例状态
createSharedComposable	最后一个订阅者离开时释放（dist/index.js:583-605）	共享一个组合式函数实例，例如一个 useMouse
createInjectionState	绑定到组件树	类型化的提供者/使用者存储
provideLocal / injectLocal	同一组件或作用域内	在一个组件内提供和注入

SSR：createSharedComposable 在服务器上会回退到普通组合式函数， 因此每个请求都会获得全新的状态（dist/index.js:584）。详情： state-sharing。

参考资料

• api-surface：包含签名和默认值的完整导出清单
• migration-v15：v14 到 v15 的变更和已弃用别名映射
• debounce-throttle：过滤器、useDebounceFn、useThrottleFn 语义
• watch-utilities：watch 变体、until、whenever
• reactivity-utilities：ref/computed/同步辅助工具
• state-sharing：全局、共享和注入式状态
• timers-and-utils：定时器、计数器、格式化和普通工具函数