跳到主要内容

usePreferredColorScheme

prefers-color-scheme 媒体查询

Usage​

实时编辑器

function Demo() {
  const color = usePreferredColorScheme();

  return <div>PreferredColorScheme: {color}</div>;
};
结果
Loading...

API​

usePreferredColorScheme​

Returns​

ColorScheme: prefers-color-scheme的媒体查询值

Arguments​

参数名描述类型默认值
defaultState默认值ColorScheme | undefinedno-preference

ColorScheme​

Type​

export type ColorScheme = "dark" | "light" | "no-preference";