腾讯企业级设计体系 TDesign 发布 2022.4 第一周更新
TDesign 是一款诞生于腾讯内部、拥有完整的设计价值观和视觉风格指南的企业级设计体系,同时提供了丰富的设计资源,在设计体系基础上产出基于 Vue、React、小程序等业界主流技术栈的组件库解决方案,适合用于构建设计统一/多端覆盖/跨技术栈的企业级前端应用。
目前,TDesign 发布了 2022 年 4 月的第一周更新,带来如下变更:
组件库
Vue2 for Web 发布 0.40.1 版
Bug Fixes
Table: 修复本地数据排序,异步加载数据时分页失效的问题
详情见:https://github.com/Tencent/tdesign-vue/releases/tag/0.40.1
Vue2 for Web 发布 0.40.0 版
⚠️BREAKING CHANGES
Table: 表格行列拖拽排序功能重构,新用法请参考官网 demoForm:label为空时不再默认渲染宽度占位,需要手动设置样式保持表单对齐
Bug Fixes
Popconfirm: 修复确认框中按钮默认大小Upload: 修复上传中状态文案Popup: 修复hideEmptyPopup在动态改变内容时不生效的问题Table: 修复合并单元格边框样式问题Datepicker: 修复区间时间选择时,月份/年份选择面板样式异常的问题- 修复
Table/SelectInput/TagInput按需引入时出现composition-api相关报错的问题
Features
Table: 支持外部设置当前显示列,新增 APIdisplayColumns defaultDisplayColumns onDisplayColumnsChange
详情见:https://github.com/Tencent/tdesign-vue/releases/tag/0.40.0
Vue2 for Web 发布 0.39.1 版
Bug Fixes
Upload:- 修复
success事件先于progress事件触发时,上传文件loadingFile值不正确的问题 - 修复最大数量限制
max在多次文件选择中判断不正确的问题
- 修复
Pagination: 修复跳转页输入框展示了额外placeholder默认内容的问题TreeSelect:- 修复
treeProps中同时传入key、load时选中项显示的问题 - 修正
TreeSelect的交互行为,与Select保持一致 - 修复
filter状态下,树无法折叠的问题;修复lazy状态下,无法正确展示label的问题
- 修复
Table:- 修复虚拟滚动
threshold引起的报错
- 修复虚拟滚动
- 修复
TS定义报错问题,非Typescript或SSR项目请尽快由 0.39.0 版本升级
Features
ConfigProvider: 完善语言配置能力Table:- 表格超出省略浮层父元素更为表头
thead,避免挂载到全局 body - 过滤功能浮层元素默认挂载到
t-table,不再挂载到全局
- 表格超出省略浮层父元素更为表头
详情见:https://github.com/Tencent/tdesign-vue/releases/tag/0.39.1
Vue2 for Web 发布 0.39.0 版
⚠️BREAKING CHANGES
Table组件使用composition-api重构BaseTable HTML结构变更,写过CSS样式覆盖的同学需注意更新样式- 表头更为使用
th标签,之前为td,不符合语义 - 事件
row-db-click更为row-dblclick,onRowDbClick更为rowDblclick - 事件
row-hover更为row-mouseover,onRowHover更为onRowMouseover(本没有rowHover事件) CSS类名t-table__row-first-full-row更为t-table__first-full-row,t-table__row-last-full-row更为t-table__last-full-row
Bug Fixes
Affix: 修复onFixedChange触发时机,在固定状态发生变化时才会触发该事件(改动之前为:滚动一直触发)Table:- 自定义列配置功能:多级表头和列显示配置同时存在时,无法进行正确的列配置的问题,列配置仅显示了第一层表头
verticalAlign不生效问题- 右上角出现文字穿透问题
- 固定表头和固定列,全部使用
CSS sticky输出样式,组件仅渲染一个表格,表头和表内容 不再分开渲染输出。不仅支持table-layout: fixed模式,同时也支持table-layout: auto模式 - 设置
tableLayout:auto,maxHeight显示异常 Table组件BaseTableCol配置项fixed和ellipsis(true)属性共存导致fix阴影无法显示- 多级表头的表格 改变
children的宽度无效 - table 组件使用
PrimaryTable控制台报错t-primary-table未注册 - 表格组件设置
height或maxHeight后未出现滚动条的时候竖线不对齐 - 修复,排序图标和过滤图标同时存在时,样式异常问题
Features
Table:- 新增超出省略功能,
ellipsis支持透传Popup组件全部属性 - 新增表尾合计行,支持固定在底部,支持多行合计,支持完全自定义内容
- 新增
loadingProps透传加载组件全部特性 - 新增固定行(冻结行)
- 支持虚拟滚动
- 新增排序图标自定义,插槽
(slot='filterIcon')和渲染函数(props.filterIcon)均可 - 新增全局配置:过滤图标、空元素、异步加载文本配置、排序按钮文本配置
- 新增
scroll滚动事件 - 新增表头吸顶功能
- 新增综合功能:多级表头 + 固定表头 + 固定列 + 表头吸顶 + 虚拟滚动 + 自定义列配置
- 新增超出省略功能,
详情见:https://github.com/Tencent/tdesign-vue/releases/tag/0.39.0
Vue3 for Web 发布 0.11.1 版
Bug Fixes
- 重构
Tabs为Composition-api - 修复
Upload triggerupload方法未导出 - 修复
InputNumber未注册input组件 - 修复
CheckboxGroup disabled属性无效 - 修复
Input的type传入无效 - 修复
SelectInputDemo 样式 - 修复
Pagination跳转页输入框展示了额外placeholder默认内容
Features
- 重构
TreeSelect为Composition-api - 重构 日历组件 为
Composition-api - 国际化配置迁移至
common
详情见:https://github.com/Tencent/tdesign-vue-next/releases/tag/0.11.1
React for Web 发布 0.30.1 版
⚠️BREAKING CHANGES
Form:label为空时不再默认渲染宽度占位,需要手动设置样式保持表单对齐
Bug Fixes
Pagination: 修复输入框宽显示问题Datepicker: 修复区间选择时间,月份/年份选择时间类型异常的问题InputNumber: 修复不能输入小数点问题Popconfirm: 修复按需加载样式丢失问题Select: 修复首次focus自动搜索问题
Features
- 标签:优化组件内部逻辑
FormItem: 支持自定义嵌套模式 &label为空时不再处理占位对齐问题SelectInput:borderless和autowidth作为独立属性分开
详情见:https://github.com/Tencent/tdesign-react/releases/tag/0.30.1
Miniprogram for WeChat 发布 0.7.2 版
Bug Fixes
Search: 修复submit事件返回参数错误的问题Toast: 修复最大宽度和文案没对齐的问题Input: 修复设置clearable,点击不清除内容的问题Dialog: 修复 1px 边框在 iOS 上消失的问题Swiper: 修复延迟设置地址时,显示不正常的问题Button: 修复文案没有垂直居中的问题
Feature
Fab: 新增支持悬浮按钮Drawer: 新增支持抽屉
详情见:https://github.com/Tencent/tdesign-miniprogram/releases/tag/0.7.2
Vue3 for Mobile 发布 0.8.1 版
Bug Fixes
count-down: 单位样式 bug 修复、倒计时加入fps获取swiper: 快速滑动导致卡住问题picker: 组件 demo 修复swipe-cell: 修改组件示例,和 demo 保持一致
Feature
- 支持历史版本跳转
dropdown-menu: 更新组件的模板类型处理
详情见:https://github.com/Tencent/tdesign-mobile-vue/releases/tag/0.8.1
更新公告:https://github.com/Tencent/tdesign/releases/tag/v.2022.4.3