跳到内容

usePreferredContrast

类别
导出大小
522 B
最近更改
4个月前

响应式 prefers-contrast 媒体查询。

演示

首选对比度
no-preference

用法

js
import { usePreferredContrast } from '@vueuse/core'

const preferredContrast = usePreferredContrast()

组件用法

此函数还通过 @vueuse/components 包提供了一个无渲染组件版本。 了解更多关于用法的信息

vue
<template>
  <UsePreferredContrast v-slot="{ contrast }">
    Preferred Contrast: {{ contrast }}
  </UsePreferredContrast>
</template>

类型声明

typescript
export type ContrastType = "more" | "less" | "custom" | "no-preference"
/**
 * Reactive prefers-contrast media query.
 *
 * @see https://vueuse.org.cn/usePreferredContrast
 * @param [options]
 */
export declare function usePreferredContrast(
  options?: ConfigurableWindow,
): ComputedRef<ContrastType>

源代码

SourceDemoDocs

贡献者

Anthony Fu
Anthony Fu
丶远方
vaakian X
Zhao

更新日志

v12.0.0-beta.1 于 2024/11/21
0a9ed - feat!: 移除 Vue 2 支持,优化包并清理 (#4349)

根据 MIT 许可证发布。