useTheme / 主题的状态

此 Hooks 可以帮助用户在任意组件中获取主题状态，同时追踪状态的变化。在默认场景下 (没有改变 themeType 时)，Hooks 获取的值与 Themes.getPresets 是相同的。

通常来自 Geist 的组件已在内部预置了这些状态跟踪，你不需要改变它们。此 Hooks 只是帮助你使用 Geist 主题样式创建自己的组件。

注意下面的例子，当我们使用 Theme 定义组件后，自定义组件的样式属性将指向 Geist 的主题，在当前网站的右上角切换主题后，你会发现例子中组件的颜色将总是跟随 Geist 主题而变化。

基础的

APIs / 接口文档

useTheme

const theme: GeistUIThemes = useTheme()

export type GeistUIThemes = {
  type: string
  font: GeistUIThemesFont
  layout: GeistUIThemesLayout
  palette: GeistUIThemesPalette
  breakpoints: GeistUIThemesBreakpoints
  expressiveness: GeistUIThemesExpressiveness
}

获取预置的类型

import {
  GeistUIThemes,
  GeistUIThemesFont,
  GeistUIThemesPalette,
  GeistUIThemesExpressiveness,
  GeistUIThemesLayout,
} from '@geist-ui/core'

const myFontTheme: GeistUIThemesFont = { }
Add