Skip to content

Config Provider 全局配置

YhConfigProvider 为组件库提供全局配置,包括主题配色、国际化语言、组件尺寸等。

主题切换

通过 theme 属性可以动态切换配色。直接传入十六进制色值可实现精准的主题色覆盖。

主题切换

全局组件尺寸

配置 size 后,内部所有的 YH-UI 组件将自动应用该尺寸。

全局尺寸

完整配置示例

演示如何同时联动配置主题、语言和尺寸,构建局部的定制化 UI 环境。

提示Active
完整配置

在 Nuxt 中使用

接入 @yh-ui/nuxt 后,可直接在页面或局部作用域中使用 YhConfigProvider。主题样式会通过 CSS 变量注入当前作用域或 :root,语言、尺寸、消息配置则通过上下文向下传递。

API

Props

参数说明类型可选值默认值
theme全局主题string十六进制色值 / purpledefault
locale国际化语言包LanguagezhCn
size全局组件尺寸'large' | 'default' | 'small''default'
global是否注入到 :rootbooleantrue

Events

当前组件未暴露组件事件。

Slots

插槽名说明插槽参数
defaultProvider 作用域内的内容。

Expose

当前组件未暴露公开实例方法或属性。

主题变量

当前组件不提供组件级 themeOverrides。主题、语言、尺寸和消息等能力通过上下文配置向子组件传递。

类型导出

名称说明
YhConfigProviderPropsYhConfigProvider props 类型
YhConfigProviderSlotsYhConfigProvider slots 类型
YhConfigProviderInstanceYhConfigProvider 实例类型
ConfigProviderContextProvider 上下文类型

Released under the MIT License.