TDesign - 腾讯出品的企业级开源设计系统越发成熟稳定,支持 Vue3 / 小程序,适合开发企业中后台和移动应用

TDesign - 腾讯出品的企业级开源设计系统越发成熟稳定,支持 Vue3 / 小程序,适合开发企业中后台和移动应用

TDesing 发展越来越好了,出了好几套组件库,很成熟稳定了,新项目完全可以考虑使用。

早在2021年,腾讯的 TDesing 刚发布不久,我就写了一篇简短的文章来介绍,当时主要关注的是 TDesign 的 Vue 组件库和用来搭建 admin 后台系统的实用性。虽然当时看起来不错,但还处于测试版,和很多读者一样,我也担心会是一个 KPI 项目。

TDesign 官网

现在2年多过去了,再看 TDesign,发现这几年官方团队不仅一直在维护更新,甚至还推出了移动端的微信和 QQ 小程序版本,已经很成熟稳定,不仅腾讯内部多个明星项目在使用,很多事业单位、大型企业也在使用,开发的实用性大大增强。所以就再写一篇文章来介绍它。

TDesign 是由腾讯出品的一套完整的企业级设计体系,拥有基于 Vue / React / 小程序 等技术栈的组件库解决方案。简单地说就是不仅提供用于前端开发的组件库,还包含这套组件库设计的所有规范、设计原理以及相关的设计稿。

  • 跨端支持:桌面端 / 移动端 / 小程序,其中移动端还支持 Flutter;
  • 设计资源:提供清晰完善的设计规范文档(Figma / Sketch等),开发上游的设计师和产品经理可以直接拿来使用;
  • 开箱即用:移动端和 admin 中后台都内置了大量页面模板,开发者可以直接使用和二次修改。

组件预览

需要注意的是,TDesign 的桌面端 Vue 组件基于 Vue 2.6,Vue-Next 才是 Vue3。下面演示的 Vue-Next 桌面端组件。

Vue Next for web 目前最新版本是 2024年8月16日发布的 v1.9.9 ,我们可以通过 NPM 安装:

然后在 Vue 应用中使用

在 Vue 页面中使用,比如创建一个数据表格:

表格组件

TDesign 提供的几套组件库都支持国际化/多语言、自定义主题和暗黑模式,也支持通过配置 webpack 或者 Vite 实现按需使用,减少应用打包体积。

和 Element Plus 相比?

TDesign 和饿了么的 Element 同为设计系统,除了大部分组件都类似外,TDesign 还可以用于移动端开发,实用性更强。而且根据我使用多年 Element,有些组件性能较差,比如表格,而 TDesign 的组件,无论是桌面还是手机端,体验下来都很流畅。

开发文档

开发文档在项目开发中使用频率很高,TDesign 组件的使用文档阅读体验也更好,文档规范整洁,可以方便地查看组件使用的代码示例和 api,不同的组件还配套了使用指南,其实这也很重要,我见过很多后台的功能很难用,一个很重要的原因就是没有用对组件,只是为了实现功能,所以建议大家还是阅读一下指南,能帮助我们把功能做得更好。

哪些项目适合用 TDesign?

从设计风格上看,TDesign 的组件 UI 风格偏中性,可以说全是腾讯系产品的影子,比如腾讯云,虽然我们可以自定于主题来适配自己的项目,但从视觉上更适合做企业类的应用,特别是用来开发具有同样设计风格、跨多端的前端应用。

官方提供的 admin 系统

同时这是一套贯穿设计和开发流程的体系,非常适合中小公司使用和学习。TDesign 官方还提供了 admin 中后系统,也是开箱即用,所以无论是 admin 后台还是客户端,都可以使用 TDesign。

TDesign 是腾讯出品的企业设计系统,也是一个免费开源的项目,基于 MIT 开源协议开放源码,我们可以免费下载来使用,可以自由地用在商业项目上。

原文链接:https://www.thosefree.com/tdesign-stable

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/1557421.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

计算机基础知识:计算机中丢失 msvcr110.dll怎么修复?

1. msvcp110.dll 介绍 1.1 定义:Microsoft Visual C 2012的一部分 msvcp110.dll是Microsoft Visual C 2012 Redistributable Package的一部分,这是一个运行时库文件,包含了Microsoft Visual C 2012编译器所构建程序所需的函数和资源。 1.2…

大数据ETL数据提取转换和加载处理

什么是 ETL? 提取转换加载(英语:Extract, transform, load,简称ETL),用来描述将资料从来源端经过抽取、转置、加载至目的端的过程。ETL一词较常用在数据仓库,但其对象并不限于数据仓库。 ETL&…

Ansys Speos | 智能手环心率传感器仿真

在本例中,我们将使用Ansys Speos和Ansys Motion模拟具有动态运动的智能带光学心率传感器。通过Ansys Motion模拟智能手环的位移和人体手腕组织的变形,然后将位移和变形数据导入Speos,最后在Ansys Speos中,用模拟智能手环位移和人体…

视频合并与封面添加:打造独特视频作品的指南

在视频创作领域,将多个视频片段合并成多个完整的作品,并为其添加统一的封面图片,是提升视频专业度和吸引力的有效方法。 1打开软件,在界面功能栏里切换到“嵌套合并”版块上 2在设置视频封面中选择“使用随机封面”,并…

二叉树——左叶子节点之和

以目前所学的知识而言,对于二叉树涉及递归相关的问题,一般需要设定两个返回条件: 1、二叉树左子树或右子树遍历完后,即节点为NULL时需要返回。 2、当前节点满足题目要求时,需要对相应参数做出改变,或是直…

同城美容美发一站式到店上门服务系统小程序源码

💆‍♀️同城美容美发一站式到店上门服务:美丽,就该如此便捷💇‍♂️ 🏠一、同城服务,触手可及的美丽 在繁忙的都市生活中,我们总是在寻找那份触手可及的美丽。而“同城美容美发一站式到店上门…

OpenCV高级图形用户界面(1)创建滑动条函数createTrackbar()的使用

操作系统:ubuntu22.04 OpenCV版本:OpenCV4.9 IDE:Visual Studio Code 编程语言:C11 算法描述 创建一个滑动条并将其附加到指定的窗口。 该函数 createTrackbar 创建一个具有指定名称和范围的滑动条(滑块或范围控制)…

0基础做微信扫码点餐小程序,开发一款餐饮点餐软件收银系统

扫码点餐小程序收银系统是一种现代化的餐饮管理工具,它结合了移动互联网技术和餐饮业务需求,为餐厅提供了高效、便捷的点餐、收银和管理服务。以下是对该系统的详细介绍和功能解析: 一、系统介绍 扫码点餐小程序收银系统通常由系统后台、手…

JS设计模式之职责链模式:优雅地处理请求流程

一. 前言 在前端开发中,我们经常会遇到需要按照一定的顺序处理一系列请求或操作的情况,如果将每一步处理都硬编码在一起,会导致代码臃肿,可维护性和可扩展性都会大大降低。而职责链模式恰好提供了一种优雅的解决方案。 无论你是…

大模型面试八股+答案,LLM-offer手到擒来!

你是否也曾为面试大模型八股文而苦恼?别担心!今天我就来给你分享一些绝妙的面试技巧,让你轻松应对! 🔍 第一关:了解题目 首先,一定要仔细阅读题目,理解清楚每个要求。明确问题的关键…

字母数字图像分割系统源码&数据集分享

字母数字图像分割系统源码&数据集分享 [yolov8-seg-C2f-Faster-EMA&yolov8-seg-C2f-DiverseBranchBlock等50全套改进创新点发刊_一键训练教程_Web前端展示] 1.研究背景与意义 项目参考ILSVRC ImageNet Large Scale Visual Recognition Challenge 项目…

硬件-PCB-叠层设计(四层板六层板)

文章目录 一:简介二:多层电路板结构三 PCB叠层设计的内容3.1 叠层设计的基本原则3.2 叠层设计的准备工作 四 六层PCB叠层方案介绍4.1 介绍常见的六层叠层结构并分析其优缺点 五 方案选择5.1 方案一:S-G-S-S-P-S5.2 方案二:S-S-G-P…

夹耳式耳机值得购买吗?这一篇文章扫清耳夹式耳机盲点!

近年来,夹耳式耳机备受很多人喜爱。主要原因在于这种耳机不入耳,既能保护我们的听力健康,又能让我们享受到极致的音乐体验。久而久之,人们反而对入耳式耳机戴着感到不习惯了。然而,一些想要入手夹耳式耳机的小伙伴却犯…

老板员工必看:钉钉聊天记录可以被监控吗?答案你万万想不到!

如今,无论是办公室还是居家远程工作,钉钉已经成为了许多公司不可或缺的沟通工具。 老板们依靠它安排工作、传递任务,员工们用它互相协作、讨论项目。可是,你有没有想过,钉钉聊天记录可以被监控吗? 答案可…

BP实战minist数据集

目录 前言 一、MNIST数据集介绍和加载 1.MNIST数据集介绍 2.加载数据集MNIST数据集 二、构建 BP 网络模型 1.神经网络结构图示 2.BP 网络模型代码解释 三、定义和训练BP 网络模型 四、训练结果 总结 前言 在当今人工智能与机器学习飞速发展的时代,神经网络…

SPI主从通讯稳定性之解决方法

在使用SPI通讯时,将硬件SPI用作主机的比较多,程序设计也比较容易,但是,若将硬件SPI用作从机了,网上的案例就比较少了,因为大家都有一个习惯,实在实现不了,就用软件模拟SPI来完成通讯…

函数式接口在Java中的应用与实践

1. 引言 函数式接口是Java 8引入的一个概念,它是指只有一个抽象方法的接口。函数式接口可以被用作lambda表达式的目标类型。在函数式接口中,除了抽象方法外,还可以有默认方法和静态方法。 函数式接口的引入是为了支持函数式编程&#xff0c…

Java项目: 基于SpringBoot+mybatis+maven+vue网上摄影工作室(含源码+数据库+任务书+毕业论文)

一、项目简介 本项目是一套基于SpringBootmybatismavenmavenvue网上摄影工作室 包含:项目源码、数据库脚本等,该项目附带全部源码可作为毕设使用。 项目都经过严格调试,eclipse或者idea 确保可以运行! 该系统功能完善、界面美观、…

【算法】博弈论(C/C++)

个人主页:摆烂小白敲代码 创作领域:算法、C/C 持续更新算法领域的文章,让博主在您的算法之路上祝您一臂之力 欢迎各位大佬莅临我的博客,您的关注、点赞、收藏、评论是我持续创作最大的动力 目录 博弈论: 1. Grundy数…

【MySQL】-- 表的操作

文章目录 1. 查看所有表1.1 语法 2. 创建表2.1 语法2.2 示例2.3 表在磁盘上对应的文件 3. 查看表结构3.1 语法3.2 示例 4. 查看创建表的语句5. 修改表5.1 语法5.2 示例5.2.1 向表中添加一列5.2.2 修改某列的长度5.2.3 重命名某列5.2.4 删除某个字段5.2.5 修改表名 6. 删除表6.1…