useAtTheme

沈孟平

最后更新于 2026-04-23 19:53:53

用来获取当前主题色，并提供一些主题色的衍生色变量。

返回值

名称	类型	说明
themeVars	ComputedRef<ThemeCommonVars>	Naive UI 当前主题变量
derivedColors	ComputedRef<object>	基于主题变量派生出的业务色，例如次级主色、表格 hover 背景色、半透明标签色

derivedColors 字段

名称	说明
secondaryPrimaryColor	主色的浅透明版本，适合次级主色背景
secondaryErrorColor	错误色的浅透明版本
secondaryWarningColor	警告色的浅透明版本
secondaryInfoColor	信息色的浅透明版本
tableHoverColor	表格 hover 背景色，是主色和表格底色的混色结果
tagIndeterminateColor	半透明主色，适合不确定态标签或辅助高亮

使用建议

• 适合在组件内复用“和主题相关，但不是 Naive UI 原生直接提供”的颜色。
• 如果页面已经通过 AtConfigProvider 或业务主题系统切换了明暗模式，这里的衍生色会自动跟随变化。
• 如果你已经使用 AtConfigProvider 管理明暗模式，Monaco 系组件和这里的衍生色会一起跟着变化，比较适合统一视觉风格。

适合的场景

• 表格 hover / active 背景色
• 标签、提示条、状态块的弱化背景
• 需要从主色派生一组“业务辅助色”的组件

Demo