全局配置 ConfigProvider
设置国际化语言的基本用法。
自定义空状态元素
Section titled “自定义空状态元素”通过 empty 插槽可以全局自定义空状态元素。
RTL 视图
Section titled “RTL 视图”设置组件为从右向左阅读的视图。
默认开启 allowClear
Section titled “默认开启 allowClear”设置 allow-clear 后,支持清空按钮的组件会默认继承这个配置;如果组件自己显式传入了 allow-clear 或 allowClear,则以组件 props 为准。
默认开启 allowSearch
Section titled “默认开启 allowSearch”设置 allow-search 后,支持搜索的组件会默认继承这个配置;如果组件自己显式传入了 allow-search 或 allowSearch,则以组件 props 为准。
默认下拉虚拟滚动参数
Section titled “默认下拉虚拟滚动参数”设置 virtual-list-props 后,Select、AutoComplete、Cascader、TreeSelect 这类下拉组件会默认继承这组虚拟滚动参数;如果组件自己显式传入了 virtual-list-props,则以组件 props 为准。
局部主题模式
Section titled “局部主题模式”ConfigProvider 现在可以作为局部 ThemeProvider 使用。设置 theme-mode 后,组件库会在当前子树上挂载真正的局部 sd-theme 容器,而不是只依赖 body。
Modal / Drawer 默认配置
Section titled “Modal / Drawer 默认配置”设置 modal 与 drawer 后,Modal / Drawer 会默认继承对应配置;如果组件自己显式传入了同名 props(例如 closable、ok-text、width),则以组件 props 为准。
DatePicker 默认配置
Section titled “DatePicker 默认配置”设置 date-picker 后,DatePicker / RangePicker 会默认继承对应配置;如果组件自己显式传入了同名 props(例如 show-confirm-btn、abbreviation、shortcuts),则以组件 props 为准。
<config-provider> Props
Section titled “<config-provider> Props”| 参数名 | 描述 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| prefix-cls | 组件类名前缀 | string | 'sd' | |
| locale | 配置语言包 | SDLang | - | |
| size | 大小 | Size | - | 2.14.0 |
| allow-clear | 是否默认开启清除按钮 | boolean | false | |
| allow-search | 是否默认开启搜索 | boolean | false | |
| virtual-list-props | 下拉类组件默认虚拟滚动参数 | VirtualListProps | - | |
| global | 是否全局生效 | boolean | false | 2.25.0 |
| update-at-scroll | 是否在容器滚动时更新弹出框的位置 | boolean | false | 2.25.0 |
| scroll-to-close | 是否在滚动时关闭弹出框 | boolean | false | 2.46.0 |
| exchange-time | 是否交换时间 | boolean | true | 2.48.0 |
| rtl | 视图的表现形式是从右开始向左结束 | boolean | false | |
| date-picker | DatePicker 组件默认配置 | ConfigProviderDatePicker | - | |
| modal | Modal 组件默认配置 | ConfigProviderModal | - | |
| drawer | Drawer 组件默认配置 | ConfigProviderDrawer | - | |
| json-form | JsonForm 组件默认配置 | JsonFormProviderConfig | - | |
| theme | 运行时主题对象 | SDThemeConfig | - | |
| theme-mode | 当前 ConfigProvider 子树的主题模式 | 'light' | 'dark' | - |
<config-provider> Slots
Section titled “<config-provider> Slots”| 插槽名 | 描述 | 参数 | 版本 |
|---|---|---|---|
| loading | 自定义加载中元素 | - | 2.28.0 |
| empty | 自定义空状态元素 | component: string | 2.28.0 |
global 属性设置为 true 时,会将配置内容注入到 Vue AppContext 中,一般用于解决使用 Modal、Message 组件的函数式调用方法时,配置内容无法生效的问题。
allow-clear 只会给未显式传入 allowClear 或 allow-clear 的组件提供默认值,不会覆盖组件自己已经声明的 props。
allow-search 也只会给未显式传入 allowSearch 或 allow-search 的组件提供默认值;像 filterable 这类兼容别名如果已经显式传入,同样会优先于全局配置。
virtual-list-props 目前只对下拉类组件生效,例如 Select、AutoComplete、Cascader、TreeSelect;Table、List 等非下拉组件不会读取这个全局默认值。
modal 支持以下全局默认字段:mask、maskClosable、maskStyle、alignCenter、escToClose、draggable、closable、titleAlign、top、footer、hideCancel、okText、cancelText、okButtonProps、cancelButtonProps、width。
date-picker 支持以下全局默认字段:shortcuts、shortcutsPosition、previewShortcut、showConfirmBtn、showNowBtn、dayStartOfWeek、abbreviation。
drawer 支持以下全局默认字段:placement、mask、maskClosable、escToClose、closable、header、footer、hideCancel、okText、cancelText、okButtonProps、cancelButtonProps、width、height。
json-form 支持给 JsonForm 提供默认 adapter,以及注入业务自定义字段组件注册表 components。当多个页面共享同一批业务字段组件时,优先通过 ConfigProvider 统一配置。
这些字段遵循“组件显式传参优先”原则:只有当组件未显式声明对应 prop 时,才会回退到 ConfigProvider 的默认值。
局部主题模式
Section titled “局部主题模式”theme-mode 会让 ConfigProvider 在当前子树中创建一个局部 ThemeProvider。和直接操作 body 不同,这种方式适合在同一页面上并存多个不同主题的组件区域。
当只传 theme、不传 theme-mode 时,当前子树会继承上层主题模式,仅对传入的 token 做局部增量覆盖。
如果你只需要局部主题切换,不需要 locale、rtl、size 等其他配置,也可以直接使用 ThemeProvider 组件。
自定义空状态展示
Section titled “自定义空状态展示”可以在 #empty 中自定义组件库全局的空状态展示,如果在插槽中使用到了 Empty 组件,需要开启 inConfigProvider 属性。