Wot UI 2.1.0 发布:ConfigProvider 全局配置能力升级

大家好,我是不如摸鱼去,wot-ui 的主要维护者。

Wot UI 2.1.0 正式发布啦。

这次更新不是一个"大版本重构",但对日常开发体验很有帮助:ConfigProvider 的全局配置能力进一步增强,主题变量类型也更加清晰,同时修复了一批真实使用场景中反馈的问题。

如果你正在使用 Wot UI v2,建议升级体验。

ConfigProvider 支持组件全局配置

在之前的版本中,ConfigProvider 主要负责主题模式、主题变量等全局能力。

从 2.1.0 开始,它新增了组件级全局配置能力,并且率先支持了 Button 和 Tag。

也就是说,现在你可以在应用层统一设置按钮、标签的默认表现:

vue 复制代码
<wd-config-provider
  :button="{ size: 'large', type: 'primary', round: true }"
  :tag="{ size: 'large', round: true }"
>
  <wd-button>提交</wd-button>
  <wd-tag>标签</wd-tag>
</wd-config-provider>

这样做的好处很直接:如果你的项目里大部分按钮都需要统一尺寸、统一类型、统一圆角,就不用在每个组件上重复写一遍配置了。

配置优先级如下:

text 复制代码
组件 prop > 组件专属配置 > 组件内置默认值

也就是说,全局配置只是默认值。你仍然可以在单个组件上通过 prop 覆盖它。

这对中后台、业务小程序、统一设计规范的项目来说,会省掉不少重复代码。项目越大,这类默认配置的价值就越明显。

主题变量类型更加清晰

本次版本还优化了主题变量类型的生成方式。

之前 ConfigProviderThemeVars 的生成逻辑和 ConfigProvider 自身的类型定义混在一起,维护起来不够清晰。2.1.0 将主题变量类型独立拆分到 theme-vars.ts 中,避免生成脚本覆盖手写类型定义。

同时,我们也补充了全局 SCSS 变量和部分组件变量注释。

如果你使用 TypeScript 配置主题变量,现在类型提示会更完整:

ts 复制代码
import type { ConfigProviderThemeVars } from '@wot-ui/ui'

const themeVars: ConfigProviderThemeVars = {
  buttonPrimaryBg: '#07c160',
  buttonPrimaryColor: '#ffffff'
}

这类优化看起来不显眼,但对长期维护组件库和业务项目都很重要。类型提示越清楚,使用成本就越低。

修复了一批使用问题

除了全局配置能力,本次版本也修复了多个细节问题:

  • 修复 Toast 不支持自定义 icon 颜色的问题
  • 修复 useVideoPreview 没有被导出的问题
  • 修复 Cell 的 title、label 在纯数字和英文场景下不换行的问题
  • 修复部分组件 size 属性在特定模式下不生效的问题
  • 修复不传 type 时,size 样式被默认类型覆盖的问题
  • 修正 FAB 示例中的按钮类型
  • 为多个组件补齐模板中使用的子组件导入

这些问题大多来自真实使用场景。也感谢大家持续反馈,很多细节都是靠社区一起磨出来的。

文档同步更新

2.1.0 还补充了 form-item 的 value-align 文档说明,并更新了文档中的站点链接。

如果你在使用表单、主题配置或全局配置相关能力,可以顺手看一下最新文档。

如何升级到 2.1.0

如果你已经在项目中使用 Wot UI,可以将 package.json 中的 @wot-ui/ui 版本更新到 2.1.0:

json 复制代码
{
  "dependencies": {
    "@wot-ui/ui": "2.1.0"
  }
}

然后重新安装依赖:

bash 复制代码
pnpm install

如果你想直接通过命令更新依赖版本,也可以执行:

bash 复制代码
pnpm add @wot-ui/ui@2.1.0

使用 npm 的项目可以执行:

bash 复制代码
npm install @wot-ui/ui@2.1.0

对已有项目来说,重点不是"新安装组件库",而是把当前项目里的 @wot-ui/ui 依赖版本升级到 2.1.0。

最后

Wot UI 2.1.0 是一次偏工程体验的增强版本。

它主要带来了三点变化:

  • ConfigProvider 支持 Button、Tag 全局默认配置
  • 主题变量类型拆分维护,TypeScript 提示更完整
  • 修复 Toast、Cell、useVideoPreview 等多个实际使用问题

如果你的项目已经在使用 Wot UI v2,可以升级到 2.1.0 试试看。

也欢迎大家继续反馈使用场景和建议,一起把 Wot UI 打磨得更好用。

相关资源

相关推荐
OH_TPC9 小时前
HarmonyOS APP开发---“动效君“UI动效素材库App,需要用到这个库
ui·华为·harmonyos·鸿蒙
超级新零售12 小时前
服装订货会数字化:商品版本、订单状态与后续配发数据如何衔接?
大数据·小程序·企业微信
xiezhr16 小时前
我用workBuddy开发了自己的第一个小程序并成功上线了
ai·小程序·ai agent·workbuddy
sinat_267611911 天前
用 AI 开发微信小程序(八):一个极简收纳工具的开发复盘
微信小程序·小程序
小雨爱测1 天前
Photoshop 实战入门:从界面认知到第一张成品图
ui·photoshop
螺丝钉tina1 天前
[Playwright] [02]常用命令与调试:Debug UI、Mode和 Trace Viewer
开发语言·javascript·测试工具·ui·自动化
PedroQue991 天前
0.8.2 新增 backFallback 配置,无 tabbar 页返回无忧
前端·uni-app
郝学胜-神的一滴1 天前
游戏设计:原型与开发 18:Unity入门的第一课
人工智能·程序人生·游戏·ui·unity·游戏引擎
李纲明1 天前
微信小程序真机预览白屏或 request 失败:先核 request 合法域名与 TLS,再查体验版与本地缓存
缓存·微信小程序·小程序·小程序开发·devdiy·真机预览·合法域名
PedroQue992 天前
v0.2.0 架构升级:class + reactive 重塑状态管理
前端·uni-app