Skip to content

usePreferredReducedMotion

类别
导出体积
1.22 kB
上次更改
2 months ago

响应式的 prefers-reduced-motion 媒体查询。

示例

首选动作:
no-preference

用法

ts
import { 
usePreferredReducedMotion
} from '@vueuse/core'
const
preferredMotion
=
usePreferredReducedMotion
()

组件使用

vue
<template>
  <UsePreferredReducedMotion v-slot="{ 
motion
}">
首选减少动作: {{
motion
}}
</UsePreferredReducedMotion> </template>

类型声明

ts
export type 
ReducedMotionType
= "reduce" | "no-preference"
/** * 响应式动画偏好媒体查询 * * @see https://vueuse.org/usePreferredReducedMotion * @param [options] * * @__NO_SIDE_EFFECTS__ */ export declare function
usePreferredReducedMotion
(
options
?:
ConfigurableWindow
,
):
ComputedRef
<
ReducedMotionType
>

源码

源码演示文档

贡献者

一纸忘忧
Anthony Fu
SerKo
IlyaL
Anthony Fu
丶远方
vaakian X
Zhao

更新日志

8c521 - feat(components)!: refactor components and make them consistent (#4912)
d32f8 - refactor: add @__NO_SIDE_EFFECTS__ annotations to all pure functions (#4907)
0a9ed - feat!: drop Vue 2 support, optimize bundles and clean up (#4349)