Skip to content

v9.0.0-beta.0

Compare
Choose a tag to compare
@github-actions github-actions released this 17 Jul 07:59
· 1084 commits to main since this release

   🚨 Breaking Changes

  • all: isSupported becomes Ref<boolean> instead of boolean for SSR compatibility  -  by @okxiaoliang4 in #1800
  • all: Rename function options type with consistant Use prefix, huge thanks to @okxiaoliang4! (this should not affect most of the usage case, unless you are importing those types directly)
    • All Changes
      • useSpeechSynthesis: Rename type Status to UseSpeechSynthesisStatus  -  by @antfu (db61f)
      • onKeyStroke: Rename type KeyStrokeOptions to OnKeyStrokeOptions  -  by @okxiaoliang4 in #1807
      • useAsyncState: Rename type AsyncStateOptions to UseAsyncStateOptions  -  by @okxiaoliang4 in #1809
      • useClipboard: Rename type ClipboardOptions to UseClipboardOptions and ClipboardReturn to UseClipboardReturn  -  by @okxiaoliang4 in #1861
      • useElementVisibility: Rename type VisibilityScrollTargetOptions to UseElementVisibilityOptions  -  by @okxiaoliang4 in #1863
      • useEventSource: Return type should be UseEventSourceReturn  -  by @okxiaoliang4 in #1864
      • useFavicon: Rename type FaviconOptions to UseFaviconOptions  -  by @okxiaoliang4 in #1865
      • useFocusWithin: Rename type FocusWithinReturn to UseFocusWithinReturn  -  by @okxiaoliang4 in #1866
      • useGeolocation: Rename type GeolocationOptions to UseGeolocationOptions  -  by @okxiaoliang4 in #1868
      • useIdle: Rename type IdleOptions to UseIdleOptions  -  by @okxiaoliang4 in #1869
      • useIntersectionObserver: Rename type IntersectionObserverOptions to UseIntersectionObserverOptions  -  by @okxiaoliang4 in #1870
      • useJwt: Rename type JwtOptions to UseJwtOptions and JwtResult to UseJwtReturn  -  by @okxiaoliang4 in #1899
      • useKeyModifier: Rename type ModifierOptions to UseModifierOptions  -  by @okxiaoliang4 in #1871
      • useMagicKeys: Rename type MagicKeys to UseMagicKeysReturn  -  by @okxiaoliang4 in #1873
      • useMemoize: Rename type UseMemoizedFn to UseMemoizeReturn and new type UseMemoizeOptions  -  by @okxiaoliang4 in #1872
      • useMemory: Rename type MemoryOptions to UseMemoryOptions  -  by @okxiaoliang4 in #1605
      • useMouse: Rename type MouseOptions to UseMouseOptions  -  by @okxiaoliang4 in #1877
      • useMutationObserver: Rename type MutationObserverOptions to UseMutationObserverOptions  -  by @okxiaoliang4 in #1884
      • useParallax: Rename type ParallaxOptions to UseParallaxOptions and ParallaxReturn to UseParallaxReturn  -  by @okxiaoliang4 in #1885
      • usePointerSwipe: Rename type PointerSwipeOptions to UsePointerSwipeOptions and PointerSwipeReturn to UsePointerSwipeReturn  -  by @okxiaoliang4 in #1886
      • useRTDB: Rename type RTDBOptions to UseRTDBOptions  -  by @okxiaoliang4 in #1901
      • useRafFn: Rename type RafFnOptions to UseRafFnOptions  -  by @okxiaoliang4 in #1887
      • useResizeObserver: Rename type ResizeObserverOptions to UseResizeObserverOptions  -  by @okxiaoliang4 in #1862
      • useShare: Rename type ShareOptions to UseShareOptions  -  by @okxiaoliang4 in #1888
      • useSpeechRecognition: Rename type SpeechRecognitionOptions to UseSpeechRecognitionOptions  -  by @okxiaoliang4 in #1889
      • useSpeechSynthesis: Rename type SpeechSynthesisOptions to UseSpeechSynthesisOptions  -  by @okxiaoliang4 in #1890
      • useSpeechSynthesis: Remove voiceInfo, allow voice as ref  -  by @sibbng in #1882
      • useStorage: Rename type StorageOptions to UseStorageOptions  -  by @okxiaoliang4 in #1867
      • useStorageAsync: Rename type StorageAsyncOptions to UseStorageAsyncOptions  -  by @okxiaoliang4 in #1883
      • useSwipe: Rename type SwipeOptions to UseSwipeOptions and SwipeReturn to UseSwipeReturn  -  by @okxiaoliang4 in #1891
      • useTimestamp: Rename type TimestampOptions to UseTimestampOptions  -  by @okxiaoliang4 in #1892
      • useTransition: Rename type TransitionOptions to UseTransitionOptions  -  by @okxiaoliang4 in #1893
      • useVModel: Rename type VModelOptions to UseVModelOptions  -  by @okxiaoliang4 in #1894
      • useWebSocket: Rename type WebSocketOptions to UseWebSocketOptions and WebSocketResult to UseWebSocketReturn  -  by @okxiaoliang4 in #1895
      • useWebWorkerFn: Rename type WebWorkerOptions to UseWebWorkerOptions  -  by @okxiaoliang4 in #1896
      • useWindowSize: Rename type WindowSizeOptions to UseWindowSizeOptions  -  by @okxiaoliang4 in #1897
  • math: Move logicAnd, logicOr, logicNot, useClamp to @vueuse/math  -  by @antfu in #1794, #1810
  • reactify: Enable support for reactive getter by default  -  by @antfu in #1860
  • useThrottleFn: trailing option should be false by default  -  by @webfansplz and @antfu in #1687
  • useMagicKeys: Store key instead of keyCode in current  -  by @wvffle in #1506

   🚀 Features

  • all: Support reactive getter as argument  -  in #1768

    This introduces a new convention of passing reactive getters as arguments. Previously, many of VueUse functions supports a convention to accept optional Ref as arguments (MaybeRef<T>) to making the reactivity connections. For example:

    // pass plain value
    const title = useTitle('foo') // changes title to 'foo'
    
    // pass a ref
    const myTitle = ref('foo')
    useTitle(myTitle) // changes title to 'foo'
    
    // reactive triggers the update
    myTitle.value = 'bar' // changes title to 'bar'

    Since v9.0, most of the VueUse function also accepts a getter function similar to computed or the watch source of watch to provide better flexibility.

    // before
    const title = computed(() => `${foo.value} | template`)
    useTitle(title)
    
    // with 9.0
    useTitle(() => `${foo.value} | template`)

    It also works great with Reactivity Transform.

    // before
    const title = $('foo')
    useTitle($$(title)) // you need to use $$() to preseve the reactive
    
    // with 9.0
    const title = $('foo')
    useTitle(() => title) // you can use a getter function just like `watch`
  • math: New @vueuse/math package

  • New Array related utilities

    View changes on GitHub