[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6F32R4Q2TNDVSF5RC2K72QC":3,"skill-same:01M6F32R4Q2TNDVSF5RC2K72QC":65},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":23,"publishedAt":33,"linkOnly":34,"markdownContent":35,"markdownBody":36,"frontMatter":37,"refName":42,"commitSha":43,"skillDirectory":44,"forksCount":45,"repositoryHtmlUrl":46,"repositoryHomepageUrl":47,"ownerHtmlUrl":48,"ownerBlogUrl":6,"ownerDescription":49,"updatedAt":50,"install":51,"resources":64},"01M6F32R4Q2TNDVSF5RC2K72QC","vueuse-functions",null,"Apply VueUse composables where appropriate to build concise, maintainable Vue.js \u002F Nuxt features.","ComeOnOliver\u002Fskillshub","ComeOnOliver","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F43215937?v=4","01M6E5JNFECJAAVFE0W7SMWWD2","Haoran Shu","01M6E5JNNDQS7AJZDYFQ8TPZCK",67,"MIT","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fantfu\u002Fskills\u002Fvueuse-functions\u002FSKILL.md",[18],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000009","前端开发","SCENARIO","使用场景",[24,25,26,27,28,29,30,31,32],"vueuse functions","functions","github","https","vue","js","nuxt","build","project","2026-11-10 10:12:30",false,"---\nname: vueuse-functions\ndescription: Apply VueUse composables where appropriate to build concise, maintainable Vue.js \u002F Nuxt features.\nlicense: MIT\nmetadata:\n    author: SerKo \u003Chttps:\u002F\u002Fgithub.com\u002Fserkodev>\n    version: \"1.0\"\ncompatibility: Requires Vue 3 (or above) or Nuxt 3 (or above) project\n---\n\n# VueUse Functions\n\nThis skill is a decision-and-implementation guide for VueUse composables in Vue.js \u002F Nuxt projects. It maps requirements to the most suitable VueUse function, applies the correct usage pattern, and prefers composable-based solutions over bespoke code to keep implementations concise, maintainable, and performant.\n\n## When to Apply\n\n- Apply this skill whenever assisting user development work in Vue.js \u002F Nuxt.\n- Always check first whether a VueUse function can implement the requirement.\n- Prefer VueUse composables over custom code to improve readability, maintainability, and performance.\n- Map requirements to the most appropriate VueUse function and follow the function’s invocation rule.\n- Please refer to the `Invocation` field in the below functions table. For example:\n  - `AUTO`: Use automatically when applicable.\n  - `EXTERNAL`: Use only if the user already installed the required external dependency; otherwise reconsider, and ask to install only if truly needed.\n  - `EXPLICIT_ONLY`: Use only when explicitly requested by the user.\n  > *NOTE* User instructions in the prompt or `AGENTS.md` may override a function’s default `Invocation` rule.\n\n## Functions\n\nAll functions listed below are part of the [VueUse](https:\u002F\u002Fvueuse.org\u002F) library, each section categorizes functions based on their functionality.\n\nIMPORTANT: Each function entry includes a short `Description` and a detailed `Reference`. When using any function, always consult the corresponding document in `.\u002Freferences` for Usage details and Type Declarations.\n\n### State\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createGlobalState`](references\u002FcreateGlobalState.md) | Keep states in the global scope to be reusable across Vue instances | AUTO |\n| [`createInjectionState`](references\u002FcreateInjectionState.md) | Create global state that can be injected into components | AUTO |\n| [`createSharedComposable`](references\u002FcreateSharedComposable.md) | Make a composable function usable with multiple Vue instances | AUTO |\n| [`injectLocal`](references\u002FinjectLocal.md) | Extended `inject` with ability to call `provideLocal` to provide the value in the same component | AUTO |\n| [`provideLocal`](references\u002FprovideLocal.md) | Extended `provide` with ability to call `injectLocal` to obtain the value in the same component | AUTO |\n| [`useAsyncState`](references\u002FuseAsyncState.md) | Reactive async state | AUTO |\n| [`useDebouncedRefHistory`](references\u002FuseDebouncedRefHistory.md) | Shorthand for `useRefHistory` with debounced filter | AUTO |\n| [`useLastChanged`](references\u002FuseLastChanged.md) | Records the timestamp of the last change | AUTO |\n| [`useLocalStorage`](references\u002FuseLocalStorage.md) | Reactive [LocalStorage](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FlocalStorage) | AUTO |\n| [`useManualRefHistory`](references\u002FuseManualRefHistory.md) | Manually track the change history of a ref when the using calls `commit()` | AUTO |\n| [`useRefHistory`](references\u002FuseRefHistory.md) | Track the change history of a ref | AUTO |\n| [`useSessionStorage`](references\u002FuseSessionStorage.md) | Reactive [SessionStorage](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FsessionStorage) | AUTO |\n| [`useStorage`](references\u002FuseStorage.md) | Create a reactive ref that can be used to access & modify [LocalStorage](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FlocalStorage) or [SessionStorage](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FsessionStorage) | AUTO |\n| [`useStorageAsync`](references\u002FuseStorageAsync.md) | Reactive Storage in with async support | AUTO |\n| [`useThrottledRefHistory`](references\u002FuseThrottledRefHistory.md) | Shorthand for `useRefHistory` with throttled filter | AUTO |\n\n### Elements\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useActiveElement`](references\u002FuseActiveElement.md) | Reactive `document.activeElement` | AUTO |\n| [`useDocumentVisibility`](references\u002FuseDocumentVisibility.md) | Reactively track [`document.visibilityState`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FDocument\u002FvisibilityState) | AUTO |\n| [`useDraggable`](references\u002FuseDraggable.md) | Make elements draggable | AUTO |\n| [`useDropZone`](references\u002FuseDropZone.md) | Create a zone where files can be dropped | AUTO |\n| [`useElementBounding`](references\u002FuseElementBounding.md) | Reactive [bounding box](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FElement\u002FgetBoundingClientRect) of an HTML element | AUTO |\n| [`useElementSize`](references\u002FuseElementSize.md) | Reactive size of an HTML element | AUTO |\n| [`useElementVisibility`](references\u002FuseElementVisibility.md) | Tracks the visibility of an element within the viewport | AUTO |\n| [`useIntersectionObserver`](references\u002FuseIntersectionObserver.md) | Detects that a target element's visibility | AUTO |\n| [`useMouseInElement`](references\u002FuseMouseInElement.md) | Reactive mouse position related to an element | AUTO |\n| [`useMutationObserver`](references\u002FuseMutationObserver.md) | Watch for changes being made to the DOM tree | AUTO |\n| [`useParentElement`](references\u002FuseParentElement.md) | Get parent element of the given element | AUTO |\n| [`useResizeObserver`](references\u002FuseResizeObserver.md) | Reports changes to the dimensions of an Element's content or the border-box | AUTO |\n| [`useWindowFocus`](references\u002FuseWindowFocus.md) | Reactively track window focus with `window.onfocus` and `window.onblur` events | AUTO |\n| [`useWindowScroll`](references\u002FuseWindowScroll.md) | Reactive window scroll | AUTO |\n| [`useWindowSize`](references\u002FuseWindowSize.md) | Reactive window size | AUTO |\n\n### Browser\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useBluetooth`](references\u002FuseBluetooth.md) | Reactive [Web Bluetooth API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWeb_Bluetooth_API) | AUTO |\n| [`useBreakpoints`](references\u002FuseBreakpoints.md) | Reactive viewport breakpoints | AUTO |\n| [`useBroadcastChannel`](references\u002FuseBroadcastChannel.md) | Reactive [BroadcastChannel API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FBroadcastChannel) | AUTO |\n| [`useBrowserLocation`](references\u002FuseBrowserLocation.md) | Reactive browser location | AUTO |\n| [`useClipboard`](references\u002FuseClipboard.md) | Reactive [Clipboard API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FClipboard_API) | AUTO |\n| [`useClipboardItems`](references\u002FuseClipboardItems.md) | Reactive [Clipboard API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FClipboard_API) | AUTO |\n| [`useColorMode`](references\u002FuseColorMode.md) | Reactive color mode (dark \u002F light \u002F customs) with auto data persistence | AUTO |\n| [`useCssSupports`](references\u002FuseCssSupports.md) | SSR compatible and reactive [`CSS.supports`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fdocs\u002FWeb\u002FAPI\u002FCSS\u002Fsupports_static) | AUTO |\n| [`useCssVar`](references\u002FuseCssVar.md) | Manipulate CSS variables | AUTO |\n| [`useDark`](references\u002FuseDark.md) | Reactive dark mode with auto data persistence | AUTO |\n| [`useEventListener`](references\u002FuseEventListener.md) | Use EventListener with ease | AUTO |\n| [`useEyeDropper`](references\u002FuseEyeDropper.md) | Reactive [EyeDropper API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FEyeDropper_API) | AUTO |\n| [`useFavicon`](references\u002FuseFavicon.md) | Reactive favicon | AUTO |\n| [`useFileDialog`](references\u002FuseFileDialog.md) | Open file dialog with ease | AUTO |\n| [`useFileSystemAccess`](references\u002FuseFileSystemAccess.md) | Create and read and write local files with [FileSystemAccessAPI](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FFile_System_Access_API) | AUTO |\n| [`useFullscreen`](references\u002FuseFullscreen.md) | Reactive [Fullscreen API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FFullscreen_API) | AUTO |\n| [`useGamepad`](references\u002FuseGamepad.md) | Provides reactive bindings for the [Gamepad API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FGamepad_API) | AUTO |\n| [`useImage`](references\u002FuseImage.md) | Reactive load an image in the browser | AUTO |\n| [`useMediaControls`](references\u002FuseMediaControls.md) | Reactive media controls for both `audio` and `video` elements | AUTO |\n| [`useMediaQuery`](references\u002FuseMediaQuery.md) | Reactive [Media Query](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002FMedia_Queries\u002FTesting_media_queries) | AUTO |\n| [`useMemory`](references\u002FuseMemory.md) | Reactive Memory Info | AUTO |\n| [`useObjectUrl`](references\u002FuseObjectUrl.md) | Reactive URL representing an object | AUTO |\n| [`usePerformanceObserver`](references\u002FusePerformanceObserver.md) | Observe performance metrics | AUTO |\n| [`usePermission`](references\u002FusePermission.md) | Reactive [Permissions API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FPermissions_API) | AUTO |\n| [`usePreferredColorScheme`](references\u002FusePreferredColorScheme.md) | Reactive [prefers-color-scheme](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002F@media\u002Fprefers-color-scheme) media query | AUTO |\n| [`usePreferredContrast`](references\u002FusePreferredContrast.md) | Reactive [prefers-contrast](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002F@media\u002Fprefers-contrast) media query | AUTO |\n| [`usePreferredDark`](references\u002FusePreferredDark.md) | Reactive dark theme preference | AUTO |\n| [`usePreferredLanguages`](references\u002FusePreferredLanguages.md) | Reactive [Navigator Languages](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FNavigatorLanguage\u002Flanguages) | AUTO |\n| [`usePreferredReducedMotion`](references\u002FusePreferredReducedMotion.md) | Reactive [prefers-reduced-motion](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002F@media\u002Fprefers-reduced-motion) media query | AUTO |\n| [`usePreferredReducedTransparency`](references\u002FusePreferredReducedTransparency.md) | Reactive [prefers-reduced-transparency](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002F@media\u002Fprefers-reduced-transparency) media query | AUTO |\n| [`useScreenOrientation`](references\u002FuseScreenOrientation.md) | Reactive [Screen Orientation API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FScreen_Orientation_API) | AUTO |\n| [`useScreenSafeArea`](references\u002FuseScreenSafeArea.md) | Reactive `env(safe-area-inset-*)` | AUTO |\n| [`useScriptTag`](references\u002FuseScriptTag.md) | Creates a script tag | AUTO |\n| [`useShare`](references\u002FuseShare.md) | Reactive [Web Share API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FNavigator\u002Fshare) | AUTO |\n| [`useSSRWidth`](references\u002FuseSSRWidth.md) | Used to set a global viewport width which will be used when rendering SSR components that rely on the viewport width like [`useMediaQuery`](..\u002FuseMediaQuery\u002Findex.md) or [`useBreakpoints`](..\u002FuseBreakpoints\u002Findex.md) | AUTO |\n| [`useStyleTag`](references\u002FuseStyleTag.md) | Inject reactive `style` element in head | AUTO |\n| [`useTextareaAutosize`](references\u002FuseTextareaAutosize.md) | Automatically update the height of a textarea depending on the content | AUTO |\n| [`useTextDirection`](references\u002FuseTextDirection.md) | Reactive [dir](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FHTML\u002FGlobal_attributes\u002Fdir) of the element's text | AUTO |\n| [`useTitle`](references\u002FuseTitle.md) | Reactive document title | AUTO |\n| [`useUrlSearchParams`](references\u002FuseUrlSearchParams.md) | Reactive [URLSearchParams](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FURLSearchParams) | AUTO |\n| [`useVibrate`](references\u002FuseVibrate.md) | Reactive [Vibration API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FVibration_API) | AUTO |\n| [`useWakeLock`](references\u002FuseWakeLock.md) | Reactive [Screen Wake Lock API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FScreen_Wake_Lock_API) | AUTO |\n| [`useWebNotification`](references\u002FuseWebNotification.md) | Reactive [Notification](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002Fnotification) | AUTO |\n| [`useWebWorker`](references\u002FuseWebWorker.md) | Simple [Web Workers](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWeb_Workers_API\u002FUsing_web_workers) registration and communication | AUTO |\n| [`useWebWorkerFn`](references\u002FuseWebWorkerFn.md) | Run expensive functions without blocking the UI | AUTO |\n\n### Sensors\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`onClickOutside`](references\u002FonClickOutside.md) | Listen for clicks outside of an element | AUTO |\n| [`onElementRemoval`](references\u002FonElementRemoval.md) | Fires when the element or any element containing it is removed from the DOM | AUTO |\n| [`onKeyStroke`](references\u002FonKeyStroke.md) | Listen for keyboard keystrokes | AUTO |\n| [`onLongPress`](references\u002FonLongPress.md) | Listen for a long press on an element | AUTO |\n| [`onStartTyping`](references\u002FonStartTyping.md) | Fires when users start typing on non-editable elements | AUTO |\n| [`useBattery`](references\u002FuseBattery.md) | Reactive [Battery Status API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FBattery_Status_API) | AUTO |\n| [`useDeviceMotion`](references\u002FuseDeviceMotion.md) | Reactive [DeviceMotionEvent](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FDeviceMotionEvent) | AUTO |\n| [`useDeviceOrientation`](references\u002FuseDeviceOrientation.md) | Reactive [DeviceOrientationEvent](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FDeviceOrientationEvent) | AUTO |\n| [`useDevicePixelRatio`](references\u002FuseDevicePixelRatio.md) | Reactively track [`window.devicePixelRatio`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FdevicePixelRatio) | AUTO |\n| [`useDevicesList`](references\u002FuseDevicesList.md) | Reactive [enumerateDevices](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FMediaDevices\u002FenumerateDevices) listing available input\u002Foutput devices | AUTO |\n| [`useDisplayMedia`](references\u002FuseDisplayMedia.md) | Reactive [`mediaDevices.getDisplayMedia`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FMediaDevices\u002FgetDisplayMedia) streaming | AUTO |\n| [`useElementByPoint`](references\u002FuseElementByPoint.md) | Reactive element by point | AUTO |\n| [`useElementHover`](references\u002FuseElementHover.md) | Reactive element's hover state | AUTO |\n| [`useFocus`](references\u002FuseFocus.md) | Reactive utility to track or set the focus state of a DOM element | AUTO |\n| [`useFocusWithin`](references\u002FuseFocusWithin.md) | Reactive utility to track if an element or one of its decendants has focus | AUTO |\n| [`useFps`](references\u002FuseFps.md) | Reactive FPS (frames per second) | AUTO |\n| [`useGeolocation`](references\u002FuseGeolocation.md) | Reactive [Geolocation API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FGeolocation_API) | AUTO |\n| [`useIdle`](references\u002FuseIdle.md) | Tracks whether the user is being inactive | AUTO |\n| [`useInfiniteScroll`](references\u002FuseInfiniteScroll.md) | Infinite scrolling of the element | AUTO |\n| [`useKeyModifier`](references\u002FuseKeyModifier.md) | Reactive [Modifier State](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FKeyboardEvent\u002FgetModifierState) | AUTO |\n| [`useMagicKeys`](references\u002FuseMagicKeys.md) | Reactive keys pressed state | AUTO |\n| [`useMouse`](references\u002FuseMouse.md) | Reactive mouse position | AUTO |\n| [`useMousePressed`](references\u002FuseMousePressed.md) | Reactive mouse pressing state | AUTO |\n| [`useNavigatorLanguage`](references\u002FuseNavigatorLanguage.md) | Reactive [navigator.language](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FNavigator\u002Flanguage) | AUTO |\n| [`useNetwork`](references\u002FuseNetwork.md) | Reactive [Network status](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FNetwork_Information_API) | AUTO |\n| [`useOnline`](references\u002FuseOnline.md) | Reactive online state | AUTO |\n| [`usePageLeave`](references\u002FusePageLeave.md) | Reactive state to show whether the mouse leaves the page | AUTO |\n| [`useParallax`](references\u002FuseParallax.md) | Create parallax effect easily | AUTO |\n| [`usePointer`](references\u002FusePointer.md) | Reactive [pointer state](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FPointer_events) | AUTO |\n| [`usePointerLock`](references\u002FusePointerLock.md) | Reactive [pointer lock](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FPointer_Lock_API) | AUTO |\n| [`usePointerSwipe`](references\u002FusePointerSwipe.md) | Reactive swipe detection based on [PointerEvents](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FPointerEvent) | AUTO |\n| [`useScroll`](references\u002FuseScroll.md) | Reactive scroll position and state | AUTO |\n| [`useScrollLock`](references\u002FuseScrollLock.md) | Lock scrolling of the element | AUTO |\n| [`useSpeechRecognition`](references\u002FuseSpeechRecognition.md) | Reactive [SpeechRecognition](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FSpeechRecognition) | AUTO |\n| [`useSpeechSynthesis`](references\u002FuseSpeechSynthesis.md) | Reactive [SpeechSynthesis](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FSpeechSynthesis) | AUTO |\n| [`useSwipe`](references\u002FuseSwipe.md) | Reactive swipe detection based on [`TouchEvents`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FTouchEvent) | AUTO |\n| [`useTextSelection`](references\u002FuseTextSelection.md) | Reactively track user text selection based on [`Window.getSelection`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FgetSelection) | AUTO |\n| [`useUserMedia`](references\u002FuseUserMedia.md) | Reactive [`mediaDevices.getUserMedia`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FMediaDevices\u002FgetUserMedia) streaming | AUTO |\n\n### Network\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useEventSource`](references\u002FuseEventSource.md) | An [EventSource](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FEventSource) or [Server-Sent-Events](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FServer-sent_events) instance opens a persistent connection to an HTTP server | AUTO |\n| [`useFetch`](references\u002FuseFetch.md) | Reactive [Fetch API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FFetch_API) provides the ability to abort requests | AUTO |\n| [`useWebSocket`](references\u002FuseWebSocket.md) | Reactive [WebSocket](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWebSocket\u002FWebSocket) client | AUTO |\n\n### Animation\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useAnimate`](references\u002FuseAnimate.md) | Reactive [Web Animations API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWeb_Animations_API) | AUTO |\n| [`useInterval`](references\u002FuseInterval.md) | Reactive counter that increases on every interval | AUTO |\n| [`useIntervalFn`](references\u002FuseIntervalFn.md) | Wrapper for `setInterval` with controls | AUTO |\n| [`useNow`](references\u002FuseNow.md) | Reactive current Date instance | AUTO |\n| [`useRafFn`](references\u002FuseRafFn.md) | Call function on every `requestAnimationFrame` | AUTO |\n| [`useTimeout`](references\u002FuseTimeout.md) | Reactive value that becomes `true` after a given time | AUTO |\n| [`useTimeoutFn`](references\u002FuseTimeoutFn.md) | Wrapper for `setTimeout` with controls | AUTO |\n| [`useTimestamp`](references\u002FuseTimestamp.md) | Reactive current timestamp | AUTO |\n| [`useTransition`](references\u002FuseTransition.md) | Transition between values | AUTO |\n\n### Component\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`computedInject`](references\u002FcomputedInject.md) | Combine `computed` and `inject` | AUTO |\n| [`createReusableTemplate`](references\u002FcreateReusableTemplate.md) | Define and reuse template inside the component scope | AUTO |\n| [`createTemplatePromise`](references\u002FcreateTemplatePromise.md) | Template as Promise | AUTO |\n| [`templateRef`](references\u002FtemplateRef.md) | Shorthand for binding ref to template element | AUTO |\n| [`tryOnBeforeMount`](references\u002FtryOnBeforeMount.md) | Safe `onBeforeMount` | AUTO |\n| [`tryOnBeforeUnmount`](references\u002FtryOnBeforeUnmount.md) | Safe `onBeforeUnmount` | AUTO |\n| [`tryOnMounted`](references\u002FtryOnMounted.md) | Safe `onMounted` | AUTO |\n| [`tryOnScopeDispose`](references\u002FtryOnScopeDispose.md) | Safe `onScopeDispose` | AUTO |\n| [`tryOnUnmounted`](references\u002FtryOnUnmounted.md) | Safe `onUnmounted` | AUTO |\n| [`unrefElement`](references\u002FunrefElement.md) | Retrieves the underlying DOM element from a Vue ref or component instance | AUTO |\n| [`useCurrentElement`](references\u002FuseCurrentElement.md) | Get the DOM element of current component as a ref | AUTO |\n| [`useMounted`](references\u002FuseMounted.md) | Mounted state in ref | AUTO |\n| [`useTemplateRefsList`](references\u002FuseTemplateRefsList.md) | Shorthand for binding refs to template elements and components inside `v-for` | AUTO |\n| [`useVirtualList`](references\u002FuseVirtualList.md) | Create virtual lists with ease | AUTO |\n| [`useVModel`](references\u002FuseVModel.md) | Shorthand for v-model binding | AUTO |\n| [`useVModels`](references\u002FuseVModels.md) | Shorthand for props v-model binding | AUTO |\n\n### Watch\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`until`](references\u002Funtil.md) | Promised one-time watch for changes | AUTO |\n| [`watchArray`](references\u002FwatchArray.md) | Watch for an array with additions and removals | AUTO |\n| [`watchAtMost`](references\u002FwatchAtMost.md) | `watch` with the number of times triggered | AUTO |\n| [`watchDebounced`](references\u002FwatchDebounced.md) | Debounced watch | AUTO |\n| [`watchDeep`](references\u002FwatchDeep.md) | Shorthand for watching value with `{deep: true}` | AUTO |\n| [`watchIgnorable`](references\u002FwatchIgnorable.md) | Ignorable watch | AUTO |\n| [`watchImmediate`](references\u002FwatchImmediate.md) | Shorthand for watching value with `{immediate: true}` | AUTO |\n| [`watchOnce`](references\u002FwatchOnce.md) | Shorthand for watching value with `{ once: true }` | AUTO |\n| [`watchPausable`](references\u002FwatchPausable.md) | Pausable watch | AUTO |\n| [`watchThrottled`](references\u002FwatchThrottled.md) | Throttled watch | AUTO |\n| [`watchTriggerable`](references\u002FwatchTriggerable.md) | Watch that can be triggered manually | AUTO |\n| [`watchWithFilter`](references\u002FwatchWithFilter.md) | `watch` with additional EventFilter control | AUTO |\n| [`whenever`](references\u002Fwhenever.md) | Shorthand for watching value to be truthy | AUTO |\n\n### Reactivity\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`computedAsync`](references\u002FcomputedAsync.md) | Computed for async functions | AUTO |\n| [`computedEager`](references\u002FcomputedEager.md) | Eager computed without lazy evaluation | AUTO |\n| [`computedWithControl`](references\u002FcomputedWithControl.md) | Explicitly define the dependencies of computed | AUTO |\n| [`createRef`](references\u002FcreateRef.md) | Returns a `deepRef` or `shallowRef` depending on the `deep` param | AUTO |\n| [`extendRef`](references\u002FextendRef.md) | Add extra attributes to Ref | AUTO |\n| [`reactify`](references\u002Freactify.md) | Converts plain functions into reactive functions | AUTO |\n| [`reactifyObject`](references\u002FreactifyObject.md) | Apply `reactify` to an object | AUTO |\n| [`reactiveComputed`](references\u002FreactiveComputed.md) | Computed reactive object | AUTO |\n| [`reactiveOmit`](references\u002FreactiveOmit.md) | Reactively omit fields from a reactive object | AUTO |\n| [`reactivePick`](references\u002FreactivePick.md) | Reactively pick fields from a reactive object | AUTO |\n| [`refAutoReset`](references\u002FrefAutoReset.md) | A ref which will be reset to the default value after some time | AUTO |\n| [`refDebounced`](references\u002FrefDebounced.md) | Debounce execution of a ref value | AUTO |\n| [`refDefault`](references\u002FrefDefault.md) | Apply default value to a ref | AUTO |\n| [`refManualReset`](references\u002FrefManualReset.md) | Create a ref with manual reset functionality | AUTO |\n| [`refThrottled`](references\u002FrefThrottled.md) | Throttle changing of a ref value | AUTO |\n| [`refWithControl`](references\u002FrefWithControl.md) | Fine-grained controls over ref and its reactivity | AUTO |\n| [`syncRef`](references\u002FsyncRef.md) | Two-way refs synchronization | AUTO |\n| [`syncRefs`](references\u002FsyncRefs.md) | Keep target refs in sync with a source ref | AUTO |\n| [`toReactive`](references\u002FtoReactive.md) | Converts ref to reactive | AUTO |\n| [`toRef`](references\u002FtoRef.md) | Normalize value\u002Fref\u002Fgetter to `ref` or `computed` | EXPLICIT_ONLY |\n| [`toRefs`](references\u002FtoRefs.md) | Extended [`toRefs`](https:\u002F\u002Fvuejs.org\u002Fapi\u002Freactivity-utilities.html#torefs) that also accepts refs of an object | AUTO |\n\n### Array\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useArrayDifference`](references\u002FuseArrayDifference.md) | Reactive get array difference of two arrays | AUTO |\n| [`useArrayEvery`](references\u002FuseArrayEvery.md) | Reactive `Array.every` | AUTO |\n| [`useArrayFilter`](references\u002FuseArrayFilter.md) | Reactive `Array.filter` | AUTO |\n| [`useArrayFind`](references\u002FuseArrayFind.md) | Reactive `Array.find` | AUTO |\n| [`useArrayFindIndex`](references\u002FuseArrayFindIndex.md) | Reactive `Array.findIndex` | AUTO |\n| [`useArrayFindLast`](references\u002FuseArrayFindLast.md) | Reactive `Array.findLast` | AUTO |\n| [`useArrayIncludes`](references\u002FuseArrayIncludes.md) | Reactive `Array.includes` | AUTO |\n| [`useArrayJoin`](references\u002FuseArrayJoin.md) | Reactive `Array.join` | AUTO |\n| [`useArrayMap`](references\u002FuseArrayMap.md) | Reactive `Array.map` | AUTO |\n| [`useArrayReduce`](references\u002FuseArrayReduce.md) | Reactive `Array.reduce` | AUTO |\n| [`useArraySome`](references\u002FuseArraySome.md) | Reactive `Array.some` | AUTO |\n| [`useArrayUnique`](references\u002FuseArrayUnique.md) | Reactive unique array | AUTO |\n| [`useSorted`](references\u002FuseSorted.md) | Reactive sort array | AUTO |\n\n### Time\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useCountdown`](references\u002FuseCountdown.md) | Reactive countdown timer in seconds | AUTO |\n| [`useDateFormat`](references\u002FuseDateFormat.md) | Get the formatted date according to the string of tokens passed in | AUTO |\n| [`useTimeAgo`](references\u002FuseTimeAgo.md) | Reactive time ago | AUTO |\n| [`useTimeAgoIntl`](references\u002FuseTimeAgoIntl.md) | Reactive time ago with i18n supported | AUTO |\n\n### Utilities\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createEventHook`](references\u002FcreateEventHook.md) | Utility for creating event hooks | AUTO |\n| [`createUnrefFn`](references\u002FcreateUnrefFn.md) | Make a plain function accepting ref and raw values as arguments | AUTO |\n| [`get`](references\u002Fget.md) | Shorthand for accessing `ref.value` | EXPLICIT_ONLY |\n| [`isDefined`](references\u002FisDefined.md) | Non-nullish checking type guard for Ref | AUTO |\n| [`makeDestructurable`](references\u002FmakeDestructurable.md) | Make isomorphic destructurable for object and array at the same time | AUTO |\n| [`set`](references\u002Fset.md) | Shorthand for `ref.value = x` | EXPLICIT_ONLY |\n| [`useAsyncQueue`](references\u002FuseAsyncQueue.md) | Executes each asynchronous task sequentially and passes the current task result to the next task | AUTO |\n| [`useBase64`](references\u002FuseBase64.md) | Reactive base64 transforming | AUTO |\n| [`useCached`](references\u002FuseCached.md) | Cache a ref with a custom comparator | AUTO |\n| [`useCloned`](references\u002FuseCloned.md) | Reactive clone of a ref | AUTO |\n| [`useConfirmDialog`](references\u002FuseConfirmDialog.md) | Creates event hooks to support modals and confirmation dialog chains | AUTO |\n| [`useCounter`](references\u002FuseCounter.md) | Basic counter with utility functions | AUTO |\n| [`useCycleList`](references\u002FuseCycleList.md) | Cycle through a list of items | AUTO |\n| [`useDebounceFn`](references\u002FuseDebounceFn.md) | Debounce execution of a function | AUTO |\n| [`useEventBus`](references\u002FuseEventBus.md) | A basic event bus | AUTO |\n| [`useMemoize`](references\u002FuseMemoize.md) | Cache results of functions depending on arguments and keep it reactive | AUTO |\n| [`useOffsetPagination`](references\u002FuseOffsetPagination.md) | Reactive offset pagination | AUTO |\n| [`usePrevious`](references\u002FusePrevious.md) | Holds the previous value of a ref | AUTO |\n| [`useStepper`](references\u002FuseStepper.md) | Provides helpers for building a multi-step wizard interface | AUTO |\n| [`useSupported`](references\u002FuseSupported.md) | SSR compatibility `isSupported` | AUTO |\n| [`useThrottleFn`](references\u002FuseThrottleFn.md) | Throttle execution of a function | AUTO |\n| [`useTimeoutPoll`](references\u002FuseTimeoutPoll.md) | Use timeout to poll something | AUTO |\n| [`useToggle`](references\u002FuseToggle.md) | A boolean switcher with utility functions | AUTO |\n| [`useToNumber`](references\u002FuseToNumber.md) | Reactively convert a string ref to number | AUTO |\n| [`useToString`](references\u002FuseToString.md) | Reactively convert a ref to string | AUTO |\n\n### @Electron\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useIpcRenderer`](references\u002FuseIpcRenderer.md) | Provides [ipcRenderer](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fipc-renderer) and all of its APIs with Vue reactivity | EXTERNAL |\n| [`useIpcRendererInvoke`](references\u002FuseIpcRendererInvoke.md) | Reactive [ipcRenderer.invoke API](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fipc-renderer#ipcrendererinvokechannel-args) result | EXTERNAL |\n| [`useIpcRendererOn`](references\u002FuseIpcRendererOn.md) | Use [ipcRenderer.on](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fipc-renderer#ipcrendereronchannel-listener) with ease and [ipcRenderer.removeListener](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fipc-renderer#ipcrendererremovelistenerchannel-listener) automatically on unmounted | EXTERNAL |\n| [`useZoomFactor`](references\u002FuseZoomFactor.md) | Reactive [WebFrame](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fweb-frame#webframe) zoom factor | EXTERNAL |\n| [`useZoomLevel`](references\u002FuseZoomLevel.md) | Reactive [WebFrame](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fweb-frame#webframe) zoom level | EXTERNAL |\n\n### @Firebase\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useAuth`](references\u002FuseAuth.md) | Reactive [Firebase Auth](https:\u002F\u002Ffirebase.google.com\u002Fdocs\u002Fauth) binding | EXTERNAL |\n| [`useFirestore`](references\u002FuseFirestore.md) | Reactive [Firestore](https:\u002F\u002Ffirebase.google.com\u002Fdocs\u002Ffirestore) binding | EXTERNAL |\n| [`useRTDB`](references\u002FuseRTDB.md) | Reactive [Firebase Realtime Database](https:\u002F\u002Ffirebase.google.com\u002Fdocs\u002Fdatabase) binding | EXTERNAL |\n\n### @Head\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createHead`](https:\u002F\u002Fgithub.com\u002Fvueuse\u002Fhead#api) | Create the head manager instance. | EXTERNAL |\n| [`useHead`](https:\u002F\u002Fgithub.com\u002Fvueuse\u002Fhead#api) | Update head meta tags reactively. | EXTERNAL |\n\n### @Integrations\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useAsyncValidator`](references\u002FuseAsyncValidator.md) | Wrapper for [`async-validator`](https:\u002F\u002Fgithub.com\u002Fyiminghe\u002Fasync-validator) | EXTERNAL |\n| [`useAxios`](references\u002FuseAxios.md) | Wrapper for [`axios`](https:\u002F\u002Fgithub.com\u002Faxios\u002Faxios) | EXTERNAL |\n| [`useChangeCase`](references\u002FuseChangeCase.md) | Reactive wrapper for [`change-case`](https:\u002F\u002Fgithub.com\u002Fblakeembrey\u002Fchange-case) | EXTERNAL |\n| [`useCookies`](references\u002FuseCookies.md) | Wrapper for [`universal-cookie`](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Funiversal-cookie) | EXTERNAL |\n| [`useDrauu`](references\u002FuseDrauu.md) | Reactive instance for [drauu](https:\u002F\u002Fgithub.com\u002Fantfu\u002Fdrauu) | EXTERNAL |\n| [`useFocusTrap`](references\u002FuseFocusTrap.md) | Reactive wrapper for [`focus-trap`](https:\u002F\u002Fgithub.com\u002Ffocus-trap\u002Ffocus-trap) | EXTERNAL |\n| [`useFuse`](references\u002FuseFuse.md) | Easily implement fuzzy search using a composable with [Fuse.js](https:\u002F\u002Fgithub.com\u002Fkrisk\u002Ffuse) | EXTERNAL |\n| [`useIDBKeyval`](references\u002FuseIDBKeyval.md) | Wrapper for [`idb-keyval`](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fidb-keyval) | EXTERNAL |\n| [`useJwt`](references\u002FuseJwt.md) | Wrapper for [`jwt-decode`](https:\u002F\u002Fgithub.com\u002Fauth0\u002Fjwt-decode) | EXTERNAL |\n| [`useNProgress`](references\u002FuseNProgress.md) | Reactive wrapper for [`nprogress`](https:\u002F\u002Fgithub.com\u002Frstacruz\u002Fnprogress) | EXTERNAL |\n| [`useQRCode`](references\u002FuseQRCode.md) | Wrapper for [`qrcode`](https:\u002F\u002Fgithub.com\u002Fsoldair\u002Fnode-qrcode) | EXTERNAL |\n| [`useSortable`](references\u002FuseSortable.md) | Wrapper for [`sortable`](https:\u002F\u002Fgithub.com\u002FSortableJS\u002FSortable) | EXTERNAL |\n\n### @Math\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createGenericProjection`](references\u002FcreateGenericProjection.md) | Generic version of `createProjection` | EXTERNAL |\n| [`createProjection`](references\u002FcreateProjection.md) | Reactive numeric projection from one domain to another | EXTERNAL |\n| [`logicAnd`](references\u002FlogicAnd.md) | `AND` condition for refs | EXTERNAL |\n| [`logicNot`](references\u002FlogicNot.md) | `NOT` condition for ref | EXTERNAL |\n| [`logicOr`](references\u002FlogicOr.md) | `OR` conditions for refs | EXTERNAL |\n| [`useAbs`](references\u002FuseAbs.md) | Reactive `Math.abs` | EXTERNAL |\n| [`useAverage`](references\u002FuseAverage.md) | Get the average of an array reactively | EXTERNAL |\n| [`useCeil`](references\u002FuseCeil.md) | Reactive `Math.ceil` | EXTERNAL |\n| [`useClamp`](references\u002FuseClamp.md) | Reactively clamp a value between two other values | EXTERNAL |\n| [`useFloor`](references\u002FuseFloor.md) | Reactive `Math.floor` | EXTERNAL |\n| [`useMath`](references\u002FuseMath.md) | Reactive `Math` methods | EXTERNAL |\n| [`useMax`](references\u002FuseMax.md) | Reactive `Math.max` | EXTERNAL |\n| [`useMin`](references\u002FuseMin.md) | Reactive `Math.min` | EXTERNAL |\n| [`usePrecision`](references\u002FusePrecision.md) | Reactively set the precision of a number | EXTERNAL |\n| [`useProjection`](references\u002FuseProjection.md) | Reactive numeric projection from one domain to another | EXTERNAL |\n| [`useRound`](references\u002FuseRound.md) | Reactive `Math.round` | EXTERNAL |\n| [`useSum`](references\u002FuseSum.md) | Get the sum of an array reactively | EXTERNAL |\n| [`useTrunc`](references\u002FuseTrunc.md) | Reactive `Math.trunc` | EXTERNAL |\n\n### @Motion\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useElementStyle`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-element-style) | Sync a reactive object to a target element CSS styling | EXTERNAL |\n| [`useElementTransform`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-element-transform) | Sync a reactive object to a target element CSS transform. | EXTERNAL |\n| [`useMotion`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-motion) | Putting your components in motion. | EXTERNAL |\n| [`useMotionProperties`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-motion-properties) | Access Motion Properties for a target element. | EXTERNAL |\n| [`useMotionVariants`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-motion-variants) | Handle the Variants state and selection. | EXTERNAL |\n| [`useSpring`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-spring) | Spring animations. | EXTERNAL |\n\n### @Router\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useRouteHash`](references\u002FuseRouteHash.md) | Shorthand for a reactive `route.hash` | EXTERNAL |\n| [`useRouteParams`](references\u002FuseRouteParams.md) | Shorthand for a reactive `route.params` | EXTERNAL |\n| [`useRouteQuery`](references\u002FuseRouteQuery.md) | Shorthand for a reactive `route.query` | EXTERNAL |\n\n### @RxJS\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`from`](references\u002Ffrom.md) | Wrappers around RxJS's [`from()`](https:\u002F\u002Frxjs.dev\u002Fapi\u002Findex\u002Ffunction\u002Ffrom) and [`fromEvent()`](https:\u002F\u002Frxjs.dev\u002Fapi\u002Findex\u002Ffunction\u002FfromEvent) to allow them to accept `ref`s | EXTERNAL |\n| [`toObserver`](references\u002FtoObserver.md) | Sugar function to convert a `ref` into an RxJS [Observer](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fobserver) | EXTERNAL |\n| [`useExtractedObservable`](references\u002FuseExtractedObservable.md) | Use an RxJS [`Observable`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fobservable) as extracted from one or more composables | EXTERNAL |\n| [`useObservable`](references\u002FuseObservable.md) | Use an RxJS [`Observable`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fobservable) | EXTERNAL |\n| [`useSubject`](references\u002FuseSubject.md) | Bind an RxJS [`Subject`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fsubject) to a `ref` and propagate value changes both ways | EXTERNAL |\n| [`useSubscription`](references\u002FuseSubscription.md) | Use an RxJS [`Subscription`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fsubscription) without worrying about unsubscribing from it or creating memory leaks | EXTERNAL |\n| [`watchExtractedObservable`](references\u002FwatchExtractedObservable.md) | Watch the values of an RxJS [`Observable`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fobservable) as extracted from one or more composables | EXTERNAL |\n\n### @SchemaOrg\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createSchemaOrg`](https:\u002F\u002Fvue-schema-org.netlify.app\u002Fapi\u002Fcore\u002Fcreate-schema-org.html) | Create the schema.org manager instance. | EXTERNAL |\n| [`useSchemaOrg`](https:\u002F\u002Fvue-schema-org.netlify.app\u002Fapi\u002Fcore\u002Fuse-schema-org.html) | Update schema.org reactively. | EXTERNAL |\n\n### @Sound\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useSound`](https:\u002F\u002Fgithub.com\u002Fvueuse\u002Fsound#examples) | Play sound effects reactively. | EXTERNAL |\n\n\n\n","# VueUse Functions\n\nThis skill is a decision-and-implementation guide for VueUse composables in Vue.js \u002F Nuxt projects. It maps requirements to the most suitable VueUse function, applies the correct usage pattern, and prefers composable-based solutions over bespoke code to keep implementations concise, maintainable, and performant.\n\n## When to Apply\n\n- Apply this skill whenever assisting user development work in Vue.js \u002F Nuxt.\n- Always check first whether a VueUse function can implement the requirement.\n- Prefer VueUse composables over custom code to improve readability, maintainability, and performance.\n- Map requirements to the most appropriate VueUse function and follow the function’s invocation rule.\n- Please refer to the `Invocation` field in the below functions table. For example:\n  - `AUTO`: Use automatically when applicable.\n  - `EXTERNAL`: Use only if the user already installed the required external dependency; otherwise reconsider, and ask to install only if truly needed.\n  - `EXPLICIT_ONLY`: Use only when explicitly requested by the user.\n  > *NOTE* User instructions in the prompt or `AGENTS.md` may override a function’s default `Invocation` rule.\n\n## Functions\n\nAll functions listed below are part of the [VueUse](https:\u002F\u002Fvueuse.org\u002F) library, each section categorizes functions based on their functionality.\n\nIMPORTANT: Each function entry includes a short `Description` and a detailed `Reference`. When using any function, always consult the corresponding document in `.\u002Freferences` for Usage details and Type Declarations.\n\n### State\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createGlobalState`](references\u002FcreateGlobalState.md) | Keep states in the global scope to be reusable across Vue instances | AUTO |\n| [`createInjectionState`](references\u002FcreateInjectionState.md) | Create global state that can be injected into components | AUTO |\n| [`createSharedComposable`](references\u002FcreateSharedComposable.md) | Make a composable function usable with multiple Vue instances | AUTO |\n| [`injectLocal`](references\u002FinjectLocal.md) | Extended `inject` with ability to call `provideLocal` to provide the value in the same component | AUTO |\n| [`provideLocal`](references\u002FprovideLocal.md) | Extended `provide` with ability to call `injectLocal` to obtain the value in the same component | AUTO |\n| [`useAsyncState`](references\u002FuseAsyncState.md) | Reactive async state | AUTO |\n| [`useDebouncedRefHistory`](references\u002FuseDebouncedRefHistory.md) | Shorthand for `useRefHistory` with debounced filter | AUTO |\n| [`useLastChanged`](references\u002FuseLastChanged.md) | Records the timestamp of the last change | AUTO |\n| [`useLocalStorage`](references\u002FuseLocalStorage.md) | Reactive [LocalStorage](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FlocalStorage) | AUTO |\n| [`useManualRefHistory`](references\u002FuseManualRefHistory.md) | Manually track the change history of a ref when the using calls `commit()` | AUTO |\n| [`useRefHistory`](references\u002FuseRefHistory.md) | Track the change history of a ref | AUTO |\n| [`useSessionStorage`](references\u002FuseSessionStorage.md) | Reactive [SessionStorage](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FsessionStorage) | AUTO |\n| [`useStorage`](references\u002FuseStorage.md) | Create a reactive ref that can be used to access & modify [LocalStorage](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FlocalStorage) or [SessionStorage](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FsessionStorage) | AUTO |\n| [`useStorageAsync`](references\u002FuseStorageAsync.md) | Reactive Storage in with async support | AUTO |\n| [`useThrottledRefHistory`](references\u002FuseThrottledRefHistory.md) | Shorthand for `useRefHistory` with throttled filter | AUTO |\n\n### Elements\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useActiveElement`](references\u002FuseActiveElement.md) | Reactive `document.activeElement` | AUTO |\n| [`useDocumentVisibility`](references\u002FuseDocumentVisibility.md) | Reactively track [`document.visibilityState`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FDocument\u002FvisibilityState) | AUTO |\n| [`useDraggable`](references\u002FuseDraggable.md) | Make elements draggable | AUTO |\n| [`useDropZone`](references\u002FuseDropZone.md) | Create a zone where files can be dropped | AUTO |\n| [`useElementBounding`](references\u002FuseElementBounding.md) | Reactive [bounding box](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FElement\u002FgetBoundingClientRect) of an HTML element | AUTO |\n| [`useElementSize`](references\u002FuseElementSize.md) | Reactive size of an HTML element | AUTO |\n| [`useElementVisibility`](references\u002FuseElementVisibility.md) | Tracks the visibility of an element within the viewport | AUTO |\n| [`useIntersectionObserver`](references\u002FuseIntersectionObserver.md) | Detects that a target element's visibility | AUTO |\n| [`useMouseInElement`](references\u002FuseMouseInElement.md) | Reactive mouse position related to an element | AUTO |\n| [`useMutationObserver`](references\u002FuseMutationObserver.md) | Watch for changes being made to the DOM tree | AUTO |\n| [`useParentElement`](references\u002FuseParentElement.md) | Get parent element of the given element | AUTO |\n| [`useResizeObserver`](references\u002FuseResizeObserver.md) | Reports changes to the dimensions of an Element's content or the border-box | AUTO |\n| [`useWindowFocus`](references\u002FuseWindowFocus.md) | Reactively track window focus with `window.onfocus` and `window.onblur` events | AUTO |\n| [`useWindowScroll`](references\u002FuseWindowScroll.md) | Reactive window scroll | AUTO |\n| [`useWindowSize`](references\u002FuseWindowSize.md) | Reactive window size | AUTO |\n\n### Browser\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useBluetooth`](references\u002FuseBluetooth.md) | Reactive [Web Bluetooth API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWeb_Bluetooth_API) | AUTO |\n| [`useBreakpoints`](references\u002FuseBreakpoints.md) | Reactive viewport breakpoints | AUTO |\n| [`useBroadcastChannel`](references\u002FuseBroadcastChannel.md) | Reactive [BroadcastChannel API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FBroadcastChannel) | AUTO |\n| [`useBrowserLocation`](references\u002FuseBrowserLocation.md) | Reactive browser location | AUTO |\n| [`useClipboard`](references\u002FuseClipboard.md) | Reactive [Clipboard API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FClipboard_API) | AUTO |\n| [`useClipboardItems`](references\u002FuseClipboardItems.md) | Reactive [Clipboard API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FClipboard_API) | AUTO |\n| [`useColorMode`](references\u002FuseColorMode.md) | Reactive color mode (dark \u002F light \u002F customs) with auto data persistence | AUTO |\n| [`useCssSupports`](references\u002FuseCssSupports.md) | SSR compatible and reactive [`CSS.supports`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fdocs\u002FWeb\u002FAPI\u002FCSS\u002Fsupports_static) | AUTO |\n| [`useCssVar`](references\u002FuseCssVar.md) | Manipulate CSS variables | AUTO |\n| [`useDark`](references\u002FuseDark.md) | Reactive dark mode with auto data persistence | AUTO |\n| [`useEventListener`](references\u002FuseEventListener.md) | Use EventListener with ease | AUTO |\n| [`useEyeDropper`](references\u002FuseEyeDropper.md) | Reactive [EyeDropper API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FEyeDropper_API) | AUTO |\n| [`useFavicon`](references\u002FuseFavicon.md) | Reactive favicon | AUTO |\n| [`useFileDialog`](references\u002FuseFileDialog.md) | Open file dialog with ease | AUTO |\n| [`useFileSystemAccess`](references\u002FuseFileSystemAccess.md) | Create and read and write local files with [FileSystemAccessAPI](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FFile_System_Access_API) | AUTO |\n| [`useFullscreen`](references\u002FuseFullscreen.md) | Reactive [Fullscreen API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FFullscreen_API) | AUTO |\n| [`useGamepad`](references\u002FuseGamepad.md) | Provides reactive bindings for the [Gamepad API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FGamepad_API) | AUTO |\n| [`useImage`](references\u002FuseImage.md) | Reactive load an image in the browser | AUTO |\n| [`useMediaControls`](references\u002FuseMediaControls.md) | Reactive media controls for both `audio` and `video` elements | AUTO |\n| [`useMediaQuery`](references\u002FuseMediaQuery.md) | Reactive [Media Query](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002FMedia_Queries\u002FTesting_media_queries) | AUTO |\n| [`useMemory`](references\u002FuseMemory.md) | Reactive Memory Info | AUTO |\n| [`useObjectUrl`](references\u002FuseObjectUrl.md) | Reactive URL representing an object | AUTO |\n| [`usePerformanceObserver`](references\u002FusePerformanceObserver.md) | Observe performance metrics | AUTO |\n| [`usePermission`](references\u002FusePermission.md) | Reactive [Permissions API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FPermissions_API) | AUTO |\n| [`usePreferredColorScheme`](references\u002FusePreferredColorScheme.md) | Reactive [prefers-color-scheme](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002F@media\u002Fprefers-color-scheme) media query | AUTO |\n| [`usePreferredContrast`](references\u002FusePreferredContrast.md) | Reactive [prefers-contrast](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002F@media\u002Fprefers-contrast) media query | AUTO |\n| [`usePreferredDark`](references\u002FusePreferredDark.md) | Reactive dark theme preference | AUTO |\n| [`usePreferredLanguages`](references\u002FusePreferredLanguages.md) | Reactive [Navigator Languages](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FNavigatorLanguage\u002Flanguages) | AUTO |\n| [`usePreferredReducedMotion`](references\u002FusePreferredReducedMotion.md) | Reactive [prefers-reduced-motion](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002F@media\u002Fprefers-reduced-motion) media query | AUTO |\n| [`usePreferredReducedTransparency`](references\u002FusePreferredReducedTransparency.md) | Reactive [prefers-reduced-transparency](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002F@media\u002Fprefers-reduced-transparency) media query | AUTO |\n| [`useScreenOrientation`](references\u002FuseScreenOrientation.md) | Reactive [Screen Orientation API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FScreen_Orientation_API) | AUTO |\n| [`useScreenSafeArea`](references\u002FuseScreenSafeArea.md) | Reactive `env(safe-area-inset-*)` | AUTO |\n| [`useScriptTag`](references\u002FuseScriptTag.md) | Creates a script tag | AUTO |\n| [`useShare`](references\u002FuseShare.md) | Reactive [Web Share API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FNavigator\u002Fshare) | AUTO |\n| [`useSSRWidth`](references\u002FuseSSRWidth.md) | Used to set a global viewport width which will be used when rendering SSR components that rely on the viewport width like [`useMediaQuery`](..\u002FuseMediaQuery\u002Findex.md) or [`useBreakpoints`](..\u002FuseBreakpoints\u002Findex.md) | AUTO |\n| [`useStyleTag`](references\u002FuseStyleTag.md) | Inject reactive `style` element in head | AUTO |\n| [`useTextareaAutosize`](references\u002FuseTextareaAutosize.md) | Automatically update the height of a textarea depending on the content | AUTO |\n| [`useTextDirection`](references\u002FuseTextDirection.md) | Reactive [dir](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FHTML\u002FGlobal_attributes\u002Fdir) of the element's text | AUTO |\n| [`useTitle`](references\u002FuseTitle.md) | Reactive document title | AUTO |\n| [`useUrlSearchParams`](references\u002FuseUrlSearchParams.md) | Reactive [URLSearchParams](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FURLSearchParams) | AUTO |\n| [`useVibrate`](references\u002FuseVibrate.md) | Reactive [Vibration API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FVibration_API) | AUTO |\n| [`useWakeLock`](references\u002FuseWakeLock.md) | Reactive [Screen Wake Lock API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FScreen_Wake_Lock_API) | AUTO |\n| [`useWebNotification`](references\u002FuseWebNotification.md) | Reactive [Notification](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002Fnotification) | AUTO |\n| [`useWebWorker`](references\u002FuseWebWorker.md) | Simple [Web Workers](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWeb_Workers_API\u002FUsing_web_workers) registration and communication | AUTO |\n| [`useWebWorkerFn`](references\u002FuseWebWorkerFn.md) | Run expensive functions without blocking the UI | AUTO |\n\n### Sensors\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`onClickOutside`](references\u002FonClickOutside.md) | Listen for clicks outside of an element | AUTO |\n| [`onElementRemoval`](references\u002FonElementRemoval.md) | Fires when the element or any element containing it is removed from the DOM | AUTO |\n| [`onKeyStroke`](references\u002FonKeyStroke.md) | Listen for keyboard keystrokes | AUTO |\n| [`onLongPress`](references\u002FonLongPress.md) | Listen for a long press on an element | AUTO |\n| [`onStartTyping`](references\u002FonStartTyping.md) | Fires when users start typing on non-editable elements | AUTO |\n| [`useBattery`](references\u002FuseBattery.md) | Reactive [Battery Status API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FBattery_Status_API) | AUTO |\n| [`useDeviceMotion`](references\u002FuseDeviceMotion.md) | Reactive [DeviceMotionEvent](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FDeviceMotionEvent) | AUTO |\n| [`useDeviceOrientation`](references\u002FuseDeviceOrientation.md) | Reactive [DeviceOrientationEvent](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FDeviceOrientationEvent) | AUTO |\n| [`useDevicePixelRatio`](references\u002FuseDevicePixelRatio.md) | Reactively track [`window.devicePixelRatio`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FdevicePixelRatio) | AUTO |\n| [`useDevicesList`](references\u002FuseDevicesList.md) | Reactive [enumerateDevices](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FMediaDevices\u002FenumerateDevices) listing available input\u002Foutput devices | AUTO |\n| [`useDisplayMedia`](references\u002FuseDisplayMedia.md) | Reactive [`mediaDevices.getDisplayMedia`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FMediaDevices\u002FgetDisplayMedia) streaming | AUTO |\n| [`useElementByPoint`](references\u002FuseElementByPoint.md) | Reactive element by point | AUTO |\n| [`useElementHover`](references\u002FuseElementHover.md) | Reactive element's hover state | AUTO |\n| [`useFocus`](references\u002FuseFocus.md) | Reactive utility to track or set the focus state of a DOM element | AUTO |\n| [`useFocusWithin`](references\u002FuseFocusWithin.md) | Reactive utility to track if an element or one of its decendants has focus | AUTO |\n| [`useFps`](references\u002FuseFps.md) | Reactive FPS (frames per second) | AUTO |\n| [`useGeolocation`](references\u002FuseGeolocation.md) | Reactive [Geolocation API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FGeolocation_API) | AUTO |\n| [`useIdle`](references\u002FuseIdle.md) | Tracks whether the user is being inactive | AUTO |\n| [`useInfiniteScroll`](references\u002FuseInfiniteScroll.md) | Infinite scrolling of the element | AUTO |\n| [`useKeyModifier`](references\u002FuseKeyModifier.md) | Reactive [Modifier State](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FKeyboardEvent\u002FgetModifierState) | AUTO |\n| [`useMagicKeys`](references\u002FuseMagicKeys.md) | Reactive keys pressed state | AUTO |\n| [`useMouse`](references\u002FuseMouse.md) | Reactive mouse position | AUTO |\n| [`useMousePressed`](references\u002FuseMousePressed.md) | Reactive mouse pressing state | AUTO |\n| [`useNavigatorLanguage`](references\u002FuseNavigatorLanguage.md) | Reactive [navigator.language](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FNavigator\u002Flanguage) | AUTO |\n| [`useNetwork`](references\u002FuseNetwork.md) | Reactive [Network status](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FNetwork_Information_API) | AUTO |\n| [`useOnline`](references\u002FuseOnline.md) | Reactive online state | AUTO |\n| [`usePageLeave`](references\u002FusePageLeave.md) | Reactive state to show whether the mouse leaves the page | AUTO |\n| [`useParallax`](references\u002FuseParallax.md) | Create parallax effect easily | AUTO |\n| [`usePointer`](references\u002FusePointer.md) | Reactive [pointer state](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FPointer_events) | AUTO |\n| [`usePointerLock`](references\u002FusePointerLock.md) | Reactive [pointer lock](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FPointer_Lock_API) | AUTO |\n| [`usePointerSwipe`](references\u002FusePointerSwipe.md) | Reactive swipe detection based on [PointerEvents](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FPointerEvent) | AUTO |\n| [`useScroll`](references\u002FuseScroll.md) | Reactive scroll position and state | AUTO |\n| [`useScrollLock`](references\u002FuseScrollLock.md) | Lock scrolling of the element | AUTO |\n| [`useSpeechRecognition`](references\u002FuseSpeechRecognition.md) | Reactive [SpeechRecognition](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FSpeechRecognition) | AUTO |\n| [`useSpeechSynthesis`](references\u002FuseSpeechSynthesis.md) | Reactive [SpeechSynthesis](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FSpeechSynthesis) | AUTO |\n| [`useSwipe`](references\u002FuseSwipe.md) | Reactive swipe detection based on [`TouchEvents`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FTouchEvent) | AUTO |\n| [`useTextSelection`](references\u002FuseTextSelection.md) | Reactively track user text selection based on [`Window.getSelection`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWindow\u002FgetSelection) | AUTO |\n| [`useUserMedia`](references\u002FuseUserMedia.md) | Reactive [`mediaDevices.getUserMedia`](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FMediaDevices\u002FgetUserMedia) streaming | AUTO |\n\n### Network\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useEventSource`](references\u002FuseEventSource.md) | An [EventSource](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FEventSource) or [Server-Sent-Events](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FServer-sent_events) instance opens a persistent connection to an HTTP server | AUTO |\n| [`useFetch`](references\u002FuseFetch.md) | Reactive [Fetch API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FFetch_API) provides the ability to abort requests | AUTO |\n| [`useWebSocket`](references\u002FuseWebSocket.md) | Reactive [WebSocket](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWebSocket\u002FWebSocket) client | AUTO |\n\n### Animation\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useAnimate`](references\u002FuseAnimate.md) | Reactive [Web Animations API](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FWeb_Animations_API) | AUTO |\n| [`useInterval`](references\u002FuseInterval.md) | Reactive counter that increases on every interval | AUTO |\n| [`useIntervalFn`](references\u002FuseIntervalFn.md) | Wrapper for `setInterval` with controls | AUTO |\n| [`useNow`](references\u002FuseNow.md) | Reactive current Date instance | AUTO |\n| [`useRafFn`](references\u002FuseRafFn.md) | Call function on every `requestAnimationFrame` | AUTO |\n| [`useTimeout`](references\u002FuseTimeout.md) | Reactive value that becomes `true` after a given time | AUTO |\n| [`useTimeoutFn`](references\u002FuseTimeoutFn.md) | Wrapper for `setTimeout` with controls | AUTO |\n| [`useTimestamp`](references\u002FuseTimestamp.md) | Reactive current timestamp | AUTO |\n| [`useTransition`](references\u002FuseTransition.md) | Transition between values | AUTO |\n\n### Component\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`computedInject`](references\u002FcomputedInject.md) | Combine `computed` and `inject` | AUTO |\n| [`createReusableTemplate`](references\u002FcreateReusableTemplate.md) | Define and reuse template inside the component scope | AUTO |\n| [`createTemplatePromise`](references\u002FcreateTemplatePromise.md) | Template as Promise | AUTO |\n| [`templateRef`](references\u002FtemplateRef.md) | Shorthand for binding ref to template element | AUTO |\n| [`tryOnBeforeMount`](references\u002FtryOnBeforeMount.md) | Safe `onBeforeMount` | AUTO |\n| [`tryOnBeforeUnmount`](references\u002FtryOnBeforeUnmount.md) | Safe `onBeforeUnmount` | AUTO |\n| [`tryOnMounted`](references\u002FtryOnMounted.md) | Safe `onMounted` | AUTO |\n| [`tryOnScopeDispose`](references\u002FtryOnScopeDispose.md) | Safe `onScopeDispose` | AUTO |\n| [`tryOnUnmounted`](references\u002FtryOnUnmounted.md) | Safe `onUnmounted` | AUTO |\n| [`unrefElement`](references\u002FunrefElement.md) | Retrieves the underlying DOM element from a Vue ref or component instance | AUTO |\n| [`useCurrentElement`](references\u002FuseCurrentElement.md) | Get the DOM element of current component as a ref | AUTO |\n| [`useMounted`](references\u002FuseMounted.md) | Mounted state in ref | AUTO |\n| [`useTemplateRefsList`](references\u002FuseTemplateRefsList.md) | Shorthand for binding refs to template elements and components inside `v-for` | AUTO |\n| [`useVirtualList`](references\u002FuseVirtualList.md) | Create virtual lists with ease | AUTO |\n| [`useVModel`](references\u002FuseVModel.md) | Shorthand for v-model binding | AUTO |\n| [`useVModels`](references\u002FuseVModels.md) | Shorthand for props v-model binding | AUTO |\n\n### Watch\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`until`](references\u002Funtil.md) | Promised one-time watch for changes | AUTO |\n| [`watchArray`](references\u002FwatchArray.md) | Watch for an array with additions and removals | AUTO |\n| [`watchAtMost`](references\u002FwatchAtMost.md) | `watch` with the number of times triggered | AUTO |\n| [`watchDebounced`](references\u002FwatchDebounced.md) | Debounced watch | AUTO |\n| [`watchDeep`](references\u002FwatchDeep.md) | Shorthand for watching value with `{deep: true}` | AUTO |\n| [`watchIgnorable`](references\u002FwatchIgnorable.md) | Ignorable watch | AUTO |\n| [`watchImmediate`](references\u002FwatchImmediate.md) | Shorthand for watching value with `{immediate: true}` | AUTO |\n| [`watchOnce`](references\u002FwatchOnce.md) | Shorthand for watching value with `{ once: true }` | AUTO |\n| [`watchPausable`](references\u002FwatchPausable.md) | Pausable watch | AUTO |\n| [`watchThrottled`](references\u002FwatchThrottled.md) | Throttled watch | AUTO |\n| [`watchTriggerable`](references\u002FwatchTriggerable.md) | Watch that can be triggered manually | AUTO |\n| [`watchWithFilter`](references\u002FwatchWithFilter.md) | `watch` with additional EventFilter control | AUTO |\n| [`whenever`](references\u002Fwhenever.md) | Shorthand for watching value to be truthy | AUTO |\n\n### Reactivity\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`computedAsync`](references\u002FcomputedAsync.md) | Computed for async functions | AUTO |\n| [`computedEager`](references\u002FcomputedEager.md) | Eager computed without lazy evaluation | AUTO |\n| [`computedWithControl`](references\u002FcomputedWithControl.md) | Explicitly define the dependencies of computed | AUTO |\n| [`createRef`](references\u002FcreateRef.md) | Returns a `deepRef` or `shallowRef` depending on the `deep` param | AUTO |\n| [`extendRef`](references\u002FextendRef.md) | Add extra attributes to Ref | AUTO |\n| [`reactify`](references\u002Freactify.md) | Converts plain functions into reactive functions | AUTO |\n| [`reactifyObject`](references\u002FreactifyObject.md) | Apply `reactify` to an object | AUTO |\n| [`reactiveComputed`](references\u002FreactiveComputed.md) | Computed reactive object | AUTO |\n| [`reactiveOmit`](references\u002FreactiveOmit.md) | Reactively omit fields from a reactive object | AUTO |\n| [`reactivePick`](references\u002FreactivePick.md) | Reactively pick fields from a reactive object | AUTO |\n| [`refAutoReset`](references\u002FrefAutoReset.md) | A ref which will be reset to the default value after some time | AUTO |\n| [`refDebounced`](references\u002FrefDebounced.md) | Debounce execution of a ref value | AUTO |\n| [`refDefault`](references\u002FrefDefault.md) | Apply default value to a ref | AUTO |\n| [`refManualReset`](references\u002FrefManualReset.md) | Create a ref with manual reset functionality | AUTO |\n| [`refThrottled`](references\u002FrefThrottled.md) | Throttle changing of a ref value | AUTO |\n| [`refWithControl`](references\u002FrefWithControl.md) | Fine-grained controls over ref and its reactivity | AUTO |\n| [`syncRef`](references\u002FsyncRef.md) | Two-way refs synchronization | AUTO |\n| [`syncRefs`](references\u002FsyncRefs.md) | Keep target refs in sync with a source ref | AUTO |\n| [`toReactive`](references\u002FtoReactive.md) | Converts ref to reactive | AUTO |\n| [`toRef`](references\u002FtoRef.md) | Normalize value\u002Fref\u002Fgetter to `ref` or `computed` | EXPLICIT_ONLY |\n| [`toRefs`](references\u002FtoRefs.md) | Extended [`toRefs`](https:\u002F\u002Fvuejs.org\u002Fapi\u002Freactivity-utilities.html#torefs) that also accepts refs of an object | AUTO |\n\n### Array\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useArrayDifference`](references\u002FuseArrayDifference.md) | Reactive get array difference of two arrays | AUTO |\n| [`useArrayEvery`](references\u002FuseArrayEvery.md) | Reactive `Array.every` | AUTO |\n| [`useArrayFilter`](references\u002FuseArrayFilter.md) | Reactive `Array.filter` | AUTO |\n| [`useArrayFind`](references\u002FuseArrayFind.md) | Reactive `Array.find` | AUTO |\n| [`useArrayFindIndex`](references\u002FuseArrayFindIndex.md) | Reactive `Array.findIndex` | AUTO |\n| [`useArrayFindLast`](references\u002FuseArrayFindLast.md) | Reactive `Array.findLast` | AUTO |\n| [`useArrayIncludes`](references\u002FuseArrayIncludes.md) | Reactive `Array.includes` | AUTO |\n| [`useArrayJoin`](references\u002FuseArrayJoin.md) | Reactive `Array.join` | AUTO |\n| [`useArrayMap`](references\u002FuseArrayMap.md) | Reactive `Array.map` | AUTO |\n| [`useArrayReduce`](references\u002FuseArrayReduce.md) | Reactive `Array.reduce` | AUTO |\n| [`useArraySome`](references\u002FuseArraySome.md) | Reactive `Array.some` | AUTO |\n| [`useArrayUnique`](references\u002FuseArrayUnique.md) | Reactive unique array | AUTO |\n| [`useSorted`](references\u002FuseSorted.md) | Reactive sort array | AUTO |\n\n### Time\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useCountdown`](references\u002FuseCountdown.md) | Reactive countdown timer in seconds | AUTO |\n| [`useDateFormat`](references\u002FuseDateFormat.md) | Get the formatted date according to the string of tokens passed in | AUTO |\n| [`useTimeAgo`](references\u002FuseTimeAgo.md) | Reactive time ago | AUTO |\n| [`useTimeAgoIntl`](references\u002FuseTimeAgoIntl.md) | Reactive time ago with i18n supported | AUTO |\n\n### Utilities\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createEventHook`](references\u002FcreateEventHook.md) | Utility for creating event hooks | AUTO |\n| [`createUnrefFn`](references\u002FcreateUnrefFn.md) | Make a plain function accepting ref and raw values as arguments | AUTO |\n| [`get`](references\u002Fget.md) | Shorthand for accessing `ref.value` | EXPLICIT_ONLY |\n| [`isDefined`](references\u002FisDefined.md) | Non-nullish checking type guard for Ref | AUTO |\n| [`makeDestructurable`](references\u002FmakeDestructurable.md) | Make isomorphic destructurable for object and array at the same time | AUTO |\n| [`set`](references\u002Fset.md) | Shorthand for `ref.value = x` | EXPLICIT_ONLY |\n| [`useAsyncQueue`](references\u002FuseAsyncQueue.md) | Executes each asynchronous task sequentially and passes the current task result to the next task | AUTO |\n| [`useBase64`](references\u002FuseBase64.md) | Reactive base64 transforming | AUTO |\n| [`useCached`](references\u002FuseCached.md) | Cache a ref with a custom comparator | AUTO |\n| [`useCloned`](references\u002FuseCloned.md) | Reactive clone of a ref | AUTO |\n| [`useConfirmDialog`](references\u002FuseConfirmDialog.md) | Creates event hooks to support modals and confirmation dialog chains | AUTO |\n| [`useCounter`](references\u002FuseCounter.md) | Basic counter with utility functions | AUTO |\n| [`useCycleList`](references\u002FuseCycleList.md) | Cycle through a list of items | AUTO |\n| [`useDebounceFn`](references\u002FuseDebounceFn.md) | Debounce execution of a function | AUTO |\n| [`useEventBus`](references\u002FuseEventBus.md) | A basic event bus | AUTO |\n| [`useMemoize`](references\u002FuseMemoize.md) | Cache results of functions depending on arguments and keep it reactive | AUTO |\n| [`useOffsetPagination`](references\u002FuseOffsetPagination.md) | Reactive offset pagination | AUTO |\n| [`usePrevious`](references\u002FusePrevious.md) | Holds the previous value of a ref | AUTO |\n| [`useStepper`](references\u002FuseStepper.md) | Provides helpers for building a multi-step wizard interface | AUTO |\n| [`useSupported`](references\u002FuseSupported.md) | SSR compatibility `isSupported` | AUTO |\n| [`useThrottleFn`](references\u002FuseThrottleFn.md) | Throttle execution of a function | AUTO |\n| [`useTimeoutPoll`](references\u002FuseTimeoutPoll.md) | Use timeout to poll something | AUTO |\n| [`useToggle`](references\u002FuseToggle.md) | A boolean switcher with utility functions | AUTO |\n| [`useToNumber`](references\u002FuseToNumber.md) | Reactively convert a string ref to number | AUTO |\n| [`useToString`](references\u002FuseToString.md) | Reactively convert a ref to string | AUTO |\n\n### @Electron\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useIpcRenderer`](references\u002FuseIpcRenderer.md) | Provides [ipcRenderer](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fipc-renderer) and all of its APIs with Vue reactivity | EXTERNAL |\n| [`useIpcRendererInvoke`](references\u002FuseIpcRendererInvoke.md) | Reactive [ipcRenderer.invoke API](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fipc-renderer#ipcrendererinvokechannel-args) result | EXTERNAL |\n| [`useIpcRendererOn`](references\u002FuseIpcRendererOn.md) | Use [ipcRenderer.on](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fipc-renderer#ipcrendereronchannel-listener) with ease and [ipcRenderer.removeListener](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fipc-renderer#ipcrendererremovelistenerchannel-listener) automatically on unmounted | EXTERNAL |\n| [`useZoomFactor`](references\u002FuseZoomFactor.md) | Reactive [WebFrame](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fweb-frame#webframe) zoom factor | EXTERNAL |\n| [`useZoomLevel`](references\u002FuseZoomLevel.md) | Reactive [WebFrame](https:\u002F\u002Fwww.electronjs.org\u002Fdocs\u002Fapi\u002Fweb-frame#webframe) zoom level | EXTERNAL |\n\n### @Firebase\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useAuth`](references\u002FuseAuth.md) | Reactive [Firebase Auth](https:\u002F\u002Ffirebase.google.com\u002Fdocs\u002Fauth) binding | EXTERNAL |\n| [`useFirestore`](references\u002FuseFirestore.md) | Reactive [Firestore](https:\u002F\u002Ffirebase.google.com\u002Fdocs\u002Ffirestore) binding | EXTERNAL |\n| [`useRTDB`](references\u002FuseRTDB.md) | Reactive [Firebase Realtime Database](https:\u002F\u002Ffirebase.google.com\u002Fdocs\u002Fdatabase) binding | EXTERNAL |\n\n### @Head\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createHead`](https:\u002F\u002Fgithub.com\u002Fvueuse\u002Fhead#api) | Create the head manager instance. | EXTERNAL |\n| [`useHead`](https:\u002F\u002Fgithub.com\u002Fvueuse\u002Fhead#api) | Update head meta tags reactively. | EXTERNAL |\n\n### @Integrations\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useAsyncValidator`](references\u002FuseAsyncValidator.md) | Wrapper for [`async-validator`](https:\u002F\u002Fgithub.com\u002Fyiminghe\u002Fasync-validator) | EXTERNAL |\n| [`useAxios`](references\u002FuseAxios.md) | Wrapper for [`axios`](https:\u002F\u002Fgithub.com\u002Faxios\u002Faxios) | EXTERNAL |\n| [`useChangeCase`](references\u002FuseChangeCase.md) | Reactive wrapper for [`change-case`](https:\u002F\u002Fgithub.com\u002Fblakeembrey\u002Fchange-case) | EXTERNAL |\n| [`useCookies`](references\u002FuseCookies.md) | Wrapper for [`universal-cookie`](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Funiversal-cookie) | EXTERNAL |\n| [`useDrauu`](references\u002FuseDrauu.md) | Reactive instance for [drauu](https:\u002F\u002Fgithub.com\u002Fantfu\u002Fdrauu) | EXTERNAL |\n| [`useFocusTrap`](references\u002FuseFocusTrap.md) | Reactive wrapper for [`focus-trap`](https:\u002F\u002Fgithub.com\u002Ffocus-trap\u002Ffocus-trap) | EXTERNAL |\n| [`useFuse`](references\u002FuseFuse.md) | Easily implement fuzzy search using a composable with [Fuse.js](https:\u002F\u002Fgithub.com\u002Fkrisk\u002Ffuse) | EXTERNAL |\n| [`useIDBKeyval`](references\u002FuseIDBKeyval.md) | Wrapper for [`idb-keyval`](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fidb-keyval) | EXTERNAL |\n| [`useJwt`](references\u002FuseJwt.md) | Wrapper for [`jwt-decode`](https:\u002F\u002Fgithub.com\u002Fauth0\u002Fjwt-decode) | EXTERNAL |\n| [`useNProgress`](references\u002FuseNProgress.md) | Reactive wrapper for [`nprogress`](https:\u002F\u002Fgithub.com\u002Frstacruz\u002Fnprogress) | EXTERNAL |\n| [`useQRCode`](references\u002FuseQRCode.md) | Wrapper for [`qrcode`](https:\u002F\u002Fgithub.com\u002Fsoldair\u002Fnode-qrcode) | EXTERNAL |\n| [`useSortable`](references\u002FuseSortable.md) | Wrapper for [`sortable`](https:\u002F\u002Fgithub.com\u002FSortableJS\u002FSortable) | EXTERNAL |\n\n### @Math\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createGenericProjection`](references\u002FcreateGenericProjection.md) | Generic version of `createProjection` | EXTERNAL |\n| [`createProjection`](references\u002FcreateProjection.md) | Reactive numeric projection from one domain to another | EXTERNAL |\n| [`logicAnd`](references\u002FlogicAnd.md) | `AND` condition for refs | EXTERNAL |\n| [`logicNot`](references\u002FlogicNot.md) | `NOT` condition for ref | EXTERNAL |\n| [`logicOr`](references\u002FlogicOr.md) | `OR` conditions for refs | EXTERNAL |\n| [`useAbs`](references\u002FuseAbs.md) | Reactive `Math.abs` | EXTERNAL |\n| [`useAverage`](references\u002FuseAverage.md) | Get the average of an array reactively | EXTERNAL |\n| [`useCeil`](references\u002FuseCeil.md) | Reactive `Math.ceil` | EXTERNAL |\n| [`useClamp`](references\u002FuseClamp.md) | Reactively clamp a value between two other values | EXTERNAL |\n| [`useFloor`](references\u002FuseFloor.md) | Reactive `Math.floor` | EXTERNAL |\n| [`useMath`](references\u002FuseMath.md) | Reactive `Math` methods | EXTERNAL |\n| [`useMax`](references\u002FuseMax.md) | Reactive `Math.max` | EXTERNAL |\n| [`useMin`](references\u002FuseMin.md) | Reactive `Math.min` | EXTERNAL |\n| [`usePrecision`](references\u002FusePrecision.md) | Reactively set the precision of a number | EXTERNAL |\n| [`useProjection`](references\u002FuseProjection.md) | Reactive numeric projection from one domain to another | EXTERNAL |\n| [`useRound`](references\u002FuseRound.md) | Reactive `Math.round` | EXTERNAL |\n| [`useSum`](references\u002FuseSum.md) | Get the sum of an array reactively | EXTERNAL |\n| [`useTrunc`](references\u002FuseTrunc.md) | Reactive `Math.trunc` | EXTERNAL |\n\n### @Motion\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useElementStyle`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-element-style) | Sync a reactive object to a target element CSS styling | EXTERNAL |\n| [`useElementTransform`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-element-transform) | Sync a reactive object to a target element CSS transform. | EXTERNAL |\n| [`useMotion`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-motion) | Putting your components in motion. | EXTERNAL |\n| [`useMotionProperties`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-motion-properties) | Access Motion Properties for a target element. | EXTERNAL |\n| [`useMotionVariants`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-motion-variants) | Handle the Variants state and selection. | EXTERNAL |\n| [`useSpring`](https:\u002F\u002Fmotion.vueuse.org\u002Fapi\u002Fuse-spring) | Spring animations. | EXTERNAL |\n\n### @Router\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useRouteHash`](references\u002FuseRouteHash.md) | Shorthand for a reactive `route.hash` | EXTERNAL |\n| [`useRouteParams`](references\u002FuseRouteParams.md) | Shorthand for a reactive `route.params` | EXTERNAL |\n| [`useRouteQuery`](references\u002FuseRouteQuery.md) | Shorthand for a reactive `route.query` | EXTERNAL |\n\n### @RxJS\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`from`](references\u002Ffrom.md) | Wrappers around RxJS's [`from()`](https:\u002F\u002Frxjs.dev\u002Fapi\u002Findex\u002Ffunction\u002Ffrom) and [`fromEvent()`](https:\u002F\u002Frxjs.dev\u002Fapi\u002Findex\u002Ffunction\u002FfromEvent) to allow them to accept `ref`s | EXTERNAL |\n| [`toObserver`](references\u002FtoObserver.md) | Sugar function to convert a `ref` into an RxJS [Observer](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fobserver) | EXTERNAL |\n| [`useExtractedObservable`](references\u002FuseExtractedObservable.md) | Use an RxJS [`Observable`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fobservable) as extracted from one or more composables | EXTERNAL |\n| [`useObservable`](references\u002FuseObservable.md) | Use an RxJS [`Observable`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fobservable) | EXTERNAL |\n| [`useSubject`](references\u002FuseSubject.md) | Bind an RxJS [`Subject`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fsubject) to a `ref` and propagate value changes both ways | EXTERNAL |\n| [`useSubscription`](references\u002FuseSubscription.md) | Use an RxJS [`Subscription`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fsubscription) without worrying about unsubscribing from it or creating memory leaks | EXTERNAL |\n| [`watchExtractedObservable`](references\u002FwatchExtractedObservable.md) | Watch the values of an RxJS [`Observable`](https:\u002F\u002Frxjs.dev\u002Fguide\u002Fobservable) as extracted from one or more composables | EXTERNAL |\n\n### @SchemaOrg\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`createSchemaOrg`](https:\u002F\u002Fvue-schema-org.netlify.app\u002Fapi\u002Fcore\u002Fcreate-schema-org.html) | Create the schema.org manager instance. | EXTERNAL |\n| [`useSchemaOrg`](https:\u002F\u002Fvue-schema-org.netlify.app\u002Fapi\u002Fcore\u002Fuse-schema-org.html) | Update schema.org reactively. | EXTERNAL |\n\n### @Sound\n\n| Function | Description | Invocation |\n|----------|-------------|------------|\n| [`useSound`](https:\u002F\u002Fgithub.com\u002Fvueuse\u002Fsound#examples) | Play sound effects reactively. | EXTERNAL |\n\n\n\n",{"name":5,"license":15,"metadata":38,"description":7,"compatibility":41},{"author":39,"version":40},"SerKo \u003Chttps:\u002F\u002Fgithub.com\u002Fserkodev>","1.0","Requires Vue 3 (or above) or Nuxt 3 (or above) project","main","def8531e65114c0fca8fb8551c1871ee0eed705c","skills\u002Fantfu\u002Fskills\u002Fvueuse-functions",24,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub","https:\u002F\u002Fskillshub.wtf","https:\u002F\u002Fgithub.com\u002FComeOnOliver","AI & Blockchain Engineer\r\n","2026-06-24 22:07:19",{"source":8,"skillName":5,"commands":52,"prompt":62,"zipAvailable":63},[53,56,59],{"tool":54,"command":55},"npx","npx skills add ComeOnOliver\u002Fskillshub --skill vueuse-functions",{"tool":57,"command":58},"bunx","bunx skills add ComeOnOliver\u002Fskillshub --skill vueuse-functions",{"tool":60,"command":61},"pnpm","pnpm dlx skills add ComeOnOliver\u002Fskillshub --skill vueuse-functions","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fantfu\u002Fskills\u002Fvueuse-functions\u002FSKILL.md",true,[],[66,78,88,97,103,110],{"skillNo":67,"name":68,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":69,"categories":70,"keywords":74,"publishedAt":33},"01M6FKJN13GMG4KY57J3QD8GY5","model-hierarchy-skill","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzscole\u002Fmodel-hierarchy-skill\u002Fmodel-hierarchy-skill\u002FSKILL.md",[71],{"categoryNo":72,"categoryName":73,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000023","Skill与智能体开发",[75,76,77],"model","model hierarchy","model hierarchy skill",{"skillNo":79,"name":80,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":81,"categories":82,"keywords":84,"publishedAt":33},"01M6FKJJJ6GCAMR4PPPRD12M5X","zoom-mcp","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fzoom-mcp\u002FSKILL.md",[83],{"categoryNo":72,"categoryName":73,"taxonomyType":21,"taxonomyTypeDesc":22},[85,86,87],"MCP","zoom","zoom mcp",{"skillNo":89,"name":90,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":91,"categories":92,"keywords":93,"publishedAt":33},"01M6FKJE3KYT3KPEZMEEHYKA6K","zoom-apps-sdk","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fzoom-apps-sdk\u002FSKILL.md",[],[94,95,96,86],"sdk","zoom apps sdk","apps",{"skillNo":98,"name":99,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":100,"categories":101,"keywords":102,"publishedAt":33},"01M6FKJ9EDH9Q5VWDF8HAJRSP0","windows","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwindows\u002FSKILL.md",[],[99],{"skillNo":104,"name":105,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":106,"categories":107,"keywords":109,"publishedAt":33},"01M6FKJ666BEEFC3AE9GJ72Q93","whiteboard","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwhiteboard\u002FSKILL.md",[108],{"categoryNo":72,"categoryName":73,"taxonomyType":21,"taxonomyTypeDesc":22},[105],{"skillNo":111,"name":112,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":113,"categories":114,"keywords":115,"publishedAt":33},"01M6FKJ21WFCDGTJQ2Q91T9DVW","websockets","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwebsockets\u002FSKILL.md",[],[112]]