TDesign Vue Next For Mobile 发布

介绍

内部打磨一年有余后，近日，团队发布了 TDesign 面向移动端的组件库 Vue-Next For Mobile 的 Alpha 版。

TDesign Vue-Next For Mobile 旨在满足 H5 场景下的前端页面开发需求，同时，产品保持了与 TDesign 小程序端 高度一致的设计语言 和 API，统一的 API 不仅在开发上能让开发者在多端开发中更加适应，也可以通过 API 自动生成单元测试用例。

欢迎体验

官网：https://tdesign.tencent.com/mobile-vue/overview

GitHub 仓库 GitHub - Tencent/tdesign-mobile-vue: A Vue3.x Mobile UI components lib for TDesign

特性

• 基于TDesign API体系高度统一的实现，切换框架兼容性强
• 基于TDesign的设计体系下首批输出30+个基础组件
• 基于Vue3, 使用 TypeScript 编写，提供完整的类型定义
• 支持Vue3的独立的Icon库引入tdesign-icons-vue-next
• 充分使用VueUse库的逻辑封装
• 支持按需引入和 Tree Shaking
• 支持服务端渲染

当前版本

alpha 0.8.0 版更新内容如下：

• dropdown-menu: 移除冗余的 dom 结构
• search: 修复样式丢失问题
• input：修复输入框样式丢失问题
• grid： 修复 grid-item 样式丢失问题
• 新增 pull-down-refresh 组件

详情见：https://github.com/Tencent/tdesign-mobile-vue/releases/

快速上手

安装

npm i tdesign-mobile-vue

使用方式

推荐使用 Webpack 或 Rollup 等支持 tree-shaking 特性的构建工具，无需额外配置即可实现组件按需引入：

import { createApp } from 'vue'; import { Button } from 'tdesign-mobile-vue'; const app = createApp(App); app.use(Button);

浏览器兼容性

Edge >= 12；Firefox >= 18；Chrome >= 49；Safari >= 10

后续计划(Q2)

• 无障碍访问：正在进行中
• 暗黑模式
• 国际化和语言包
• 丰富的行业组件

欢迎你使用，Star，并且通过 GitHub ISSUE 与我们交流，也期待你能通过开源协同的方式，参与 我们的共建。

了解如何参与TDesign 的共建：https://tdesign.tencent.com/about/contributing

TDesign 团队会及时在企业微信大群中同步发布版本、问题修复信息，也会有一些关于组件库建设的讨论，欢迎微信或企业微信扫码入群交流：

TDesign 企业微信群