useTheme
读写主题状态(颜色、圆角、字体、图标、深色模式)并导出 CSS 变量或配置代码。
简介
useTheme 暴露主题的响应式状态与导出方法,是 ThemePicker 组件的底层逻辑,可用于自定义主题面板或在业务逻辑中读写主题。
返回值
const {
// 颜色
color, primary, primaryColors, neutral, neutralColors,
blackAsPrimary, setBlackAsPrimary,
// 圆角 / 字体 / 图标 / 模式
radius, radiuses, font, fonts, icon, icons, mode, modes,
// 注入与状态
style, link, hasCSSChanges, hasConfigChanges,
// 导出
exportCSS, exportConfig, resetTheme
} = useTheme()
| 分组 | 成员 | 说明 |
|---|---|---|
| 颜色 | color / primary / primaryColors | 主色及可选项 |
| 颜色 | neutral / neutralColors | 中性色及可选项 |
| 颜色 | blackAsPrimary / setBlackAsPrimary | 以黑色作为主色的开关 |
| 圆角 | radius / radiuses | 当前圆角及可选档位 |
| 字体 | font / fonts | 当前字体及可选项 |
| 图标 | icon / icons | 当前图标集及可选项 |
| 模式 | mode / modes | 深色模式(light/dark/system)及可选项 |
| 注入 | style / link | 需注入到页面的 CSS 变量与字体链接 |
| 状态 | hasCSSChanges / hasConfigChanges | 是否有相对默认的改动 |