usePreferredDark
响应式深色主题偏好
Reactive dark theme preference.
例子
Usage
js
import { usePreferredDark } from '@vueuse/core'
const isDark = usePreferredDark()
import { usePreferredDark } from '@vueuse/core'
const isDark = usePreferredDark()
Component Usage
该函数还通过
@vueuse/components
提供了一个无渲染的组件版本。了解更多.
This function also provides a renderless component version via the
@vueuse/components
package. Learn more about the usage.
html
<UsePreferredDark v-slot="{ prefersDark }">
Prefers Dark: {{ prefersDark }}
</UsePreferredDark>
<UsePreferredDark v-slot="{ prefersDark }">
Prefers Dark: {{ prefersDark }}
</UsePreferredDark>
Type Declarations
typescript
/**
* Reactive dark theme preference.
*
* @see https://vueuse.org/usePreferredDark
* @param [options]
*/
export declare function usePreferredDark(
options?: ConfigurableWindow
): Ref<boolean>
/**
* Reactive dark theme preference.
*
* @see https://vueuse.org/usePreferredDark
* @param [options]
*/
export declare function usePreferredDark(
options?: ConfigurableWindow
): Ref<boolean>