600字范文 > ant design vue table 高度自适应_Vue 组件库大对比 Element iView HeyUI Ant Design Vue

ant design vue table 高度自适应_Vue 组件库大对比 Element iView HeyUI Ant Design Vue

时间：2023-10-11 15:56:29

我写了一篇Vue组件库对比文档。

一年的时间，每一个组件库都有了更多的发展，Ant Design 也出了vue版本的组件库。

所以，在今年，我对目前发展比较稳定以及功能比较齐全的 Vue组件库做出了评测。

关于评测

相信看这一篇文章的人，肯定也会对 “选择使用哪个组件库？” 这个问题感到烦恼。

组件库的选择，对于前端系统的开发有着至关紧要的影响，

而组件的丰富性以及健壮性是我们要考虑的重点。

所以，本次比对，主要是从组件的多少，以及核心组件的对比来评判。

而对于选择哪个组件库的这个问题，其实，我从开发者的角度来说，每个组件库都可以选择，基本上，四种组件库都已经挺完善的了，开发者按照自己的需求选择即可。

组件库

Element UI

官方网站：https://element.eleme.io/#/

Github: /ElemeFE/element

iView UI

官方网站：/

Github: /iview/iview

Ant Design of Vue

官方网站：https://vue.ant.design/docs/vue/introduce-cn/

Github: /ElemeFE/element

HeyUI

官方网站：https://www.heyui.top/

Github: /heyui/heyui/

组件对比

我花了一些时间，对这四款组件库做了一个比较详细的比较。

基础组件

四个组件库，大概有47个都具备的组件。

Grid 栅格Layout 布局Icon 图标Button 按钮Input 输入框Radio 单选Checkbox 多选Select下拉选择AutoComplete模糊匹配NumberInput 数字输入Switch 开关Slider 滑块Rate 评分SwitchList 选项切换Form表单Search 搜索框Uploader 上传Tree树Transfer 穿梭框DatePicker日期选择TimePicker 时间选择DatetimePicker 日期时间选择DateRangePicker 日期范围选择Cascader 级联选择Breadcrumb 面包屑Menu 菜单Pagination 分页Tabs 标签页Steps 步骤条DropdownMenu 下拉菜单BackTop 返回顶部Panel 面板Tag 标签Table表格Avatar 头像信息Badge 微标数Carousel 走马灯Collapse 折叠面板Progress 进度条Loading 加载中LoadingBar 加载进度条Timeline 时间轴Message 提示Notice 通知Modal 弹出框Tooltip 气泡提示Poptip 确定提示

PS，每个组件库不一定是相同的命名，但是，大致是一样的组件。

其中，Form，Table，Select，AutoComplete，Tree，DatePicker是我认为的一个组件库的核心组件。

而不同的组件库在这几个组件上的实现，都是有比较多差异的。

这里，我主要着重于Table的差异分析，其他的组件，用户可以参考自己的需求，再逐一对比。