Element Plus 和 Ant Design Vue 对比测评，哪个更好？

本文首发：《Element Plus 和 Ant Design Vue 对比测评，哪个更好？》

Vue 3 发布后，各家第三方库开始陆续重构并支持 Vue 3 ，国内两大知名框架 Element Plus 和 Ant Design Vue 也相续发布新版支持 Vue 3。到底应该怎么选择呢？本文从多个纬度对两个框架进行对比和测评。

Element Plus 发布正式版后，下载量飙升，当然这也依托于 Element UI 的占有率和好口碑。有关 Element Plus 的入门教程可看这篇：《Element Plus for Vue 3 入门教程》

框架版本对 Vue 的支持

Element UI 支持 Vue 2
Element Plus 支持 Vue 3
Ant Design Vue 1.x 支持 Vue 2
Ant Design Vue 3.x 支持 Vue 3

Element Plus 是为了适配 Vue 3 对 Element UI 进行的重构。Vue 3.0 的这次大版本升级，对于第三方组件库来说是一件好事，那些已经修修补补无数次，还无法彻底解决的问题，在这次面向 Vue 3.0 重构时，一次性全部解决。

Ant Design Vue 1.x 仅支持 Vue 2 ，2.x 是为了 Vue 3 开发的兼容版，并没有任何新特性，大多数的 API 也只是为了更好的兼容 Vue 3 ，3.x 版在易用性、功能、性能上都有了很大的提升，可以说是对 Vue 3 比较成熟支持的版本了。

浏览器兼容性

Element Plus 和 Ant Design Vue 3 都已不在支持 IE 了，并不是他们自己放弃了 IE 而是 Vue 3 本身已经放弃了 IE。如果想在低版本浏览器上正常使用这两个框架，可使用 Babel、ESBuild 或其他转换工具，并引入相应的 polyfill。

Element Plus 使用到了 ResizeObserver，如有兼容性需求可自行引入 resize-observer-polyfill。详情请参阅 ResizeObserver 的兼容性。

组件功能与特点

Element Plus 共 68 个组件，Ant Design Vue 3.x 共 64 个组件。

table 组件：Element Plus 自带 virtual scroll ，Ant Design Vue 需要购买 Surely 这个高级包。如果需要用表格处理大量数据，Element Plus 更合适。Ant Design table ，定义好 columns 有几列后，用 template 写法就无法用 v-if 去隐藏某一列
在 Ant Design Vue 里，Modal.confirm 某些 api 不支持 promise 写法，需要写在回调函数里
TreeSelect 组件：Ant Design tree 组件写自定义内容不方便。而 Element 更好用。
form 表单组件：两个框架功能基本一致，包含数据收集，表单校验和提交功能。input、checkbox 、select 等常用功能两个框架都有。
Ant Design Vue 2 & 3 是最早支持 Vue 3 的框架之一，新版本解决了很多 Vue 用户群在旧版本不喜欢的「单向数据流 value + change event」，实现了全 v-model 使用组件。

维护状态

Element Plus 与 Element UI 一样依然是饿了么团队开发支持和维护。前段时间传闻 Element UI 无人维护，不更新了。其实只是团队在全力开发 Element Plus 而已。Element 团队的迭代速度有目共睹，可放心使用。

Ant Design Vue 是 Ant Design的 Vue 实现，UI 风格和 Ant Design 保持 1:1 复刻。Ant Design Vue 虽然是以个人开发开始起步的，算是社区版，但它得到了蚂蚁官方认可，挂在蚂蚁金服底下的正式项目，保持了不错的更新和维护状态。

Element Plus、Ant Design Vue 与卡拉云对比

Element Plus 与 Ant Design Vue 都是 Vue 3 的一个组件库，所以使用 Element 和 antdv 首先要搭 Vue 3 开发环境，然后再引入组件库，再按照文档的说明，根据自己的需求进行二次开发。使用 Element 和 antdv 相对来说对前端技能要求较高。

卡拉云是新一代低代码开发平台，与 Element 和 antdv 相比，卡拉云的优势在于不用搭建 Vue 环境，直接注册即可开始使用。开发者完全不用处理任何前端问题，只需简单拖拽，即可快速生成所需组件，可一键接入包括 MySQL 在内的常见数据库及 API，根据引导简单几步打通前后端，数周的开发时间，缩短至 1 小时。

卡拉云搭建的数据看板 DEMO：https://my.kalacloud.com/apps/ykxauq3u6r/published

使用卡拉云 10 分钟内搭建的「天气预报数据看板」，简单拖拽，几行代码即可快速完成，搭建即发布，可一键分享给其他同学一起使用。立即注册使用卡拉云。

扩展阅读：