千呼万唤始出来,ElementPlus正式版正式发布,VueAdminWorkX第一时间升级更新

简介: 千呼万唤始出来,ElementPlus正式版正式发布,VueAdminWorkX第一时间升级更新

前言

做Vue开发的小伙伴肯定都知道一个框架ElementUI。不过随着Vue3的发布,ElementUI也没有更新,还是挺遗憾的。但是社区小伙伴们一起搞了一个ElementPlus做为ElementUI的继任者。最近ElementPlus终于发布了正式的版本,还是很值得一试的。

之前 beta 了一大堆。说实话,等的有点着急了,不过还好没放弃,ElementPlus 2.0.0正式版正式发布

"ElementPlus自第一个 commit 起,经过 1 年零 7 个月的持续迭代开发,总计 2635 commits,经过 256 位贡献者所提交的 2494 个 PR,137 个 Alpha 与 Beta 版本,在社区每一位同学的参与帮助下,Element Plus 的第一个正式版终于和大家见面。"(来自掘金)

可以看出大家也都是非常用心的在做这件事情。虽然未能参与其中的开发,但是我在很早之前就对 ElementPlus 做了一套后台系统:VueAdminWorkX

VueAdminWorkX是基于Vue3 + Webpack + Typescript + ElementPlus 架构开发而来。

现在已经完全免费开源给大家使用。

如果想要获取源码,可以关注本公众号然后再回复数字 1  就可以获取所有的版本源码下载地址


ElementPlus的重要升级

个人感觉 ElementPlus 和 之前的 ElementUI 无论是在引入,使用上差别还是不小的。

全面支持Typescript和Vue3

新的 ElementPlus 使用 TypeScript 与 Vue 3.2 开发,提供完整的类型定义文件。并使用 Composition API 降低耦合,简化逻辑。这点还是很符合Vue3的。

同样的的Vue3已经完全不支持 IE ,ElementPlus组件库也不再兼容IE浏览器。当然

VueAdminWorkX肯定也不会再支持IE浏览器了。

新增了一个全局配置管理的组件 config-provider

这个新的组件可以说和之前相比还是很值得点赞的,方便灵活了很多。用法也简单,无论是国际化还是主题配置都是比较方便的

<template>
  <div>
    <el-config-provider :locale="locale2">
      <el-color-picker :model-value="''" style="vertical-align: middle" />
    </el-config-provider>
    <el-button style="margin-left: 8px; vertical-align: middle" @click="toggle">
      Switch Lang
    </el-button>
  </div>
</template>

暗色主题

之前的ElementUI想要调整一下主题还是挺麻烦的。需要先生成一个主题包再引入,灵活性降低了很多。

但ElementPlus采用了 CSS Variables 这将比之前的 SASS 变量配置模式更方便且性能更好。

而且官方正在制作 暗黑主题 ,大家拭目以待,应该会很方便支持暗黑主题。

高性能表格组件

"在 Beta 发布的时候,我们提到过提供使用虚拟化能力的表格,来优化大数据量情况下的 Table 组件性能。但本次的正式版发布暂未包含这部分功能,而会在后续的迭代中加入。一直没有把这个功能落地下来有很大一部分原因是,我们一直在探索到底哪一种方式是更加适合用户的。是我们直接加入虚拟化的表格渲染引擎,亦或是我们提供渲染接口让用户自己添加虚拟化的组件(类似 vue-virtual-scroller 这样的组件)来自行渲染。后续我们会参考结合现在市面上相关组件的实现,提供一套解决方案,让 Element Plus 的 Table 组件更加好用。"(出自掘金)

还有好多新的组件和特点这里不一一列举了,大家可以下载下来亲自试一下。


VueAdminWorkX的重要升级

在第一时间得知ElementPlus发布了正式版之后,我就马上对VueAdminWorkX进行了升级。

把组件库升级到了最新的版本:v2.0.1。

同时,还带来了一个重要的升级,

就是把 上下布局模式 重新做了一下。

之前的模式不太符合用户的操作习惯。

大家可以去github或者gitee上下载源码,如果可以请给个 star

4edc953e2c684bbe819ffa954c899c08.png4edc953e2c684bbe819ffa954c899c08.png

相关文章
|
编解码 图形学 C++
如何在Blender中压缩/减小GLTF模型的大小
Blender是一款功能强大的开源软件,旨在创建3D图形,动画和视觉效果。它支持多种文件格式的导入和导出,包括GLB,GLTF,DAE,OBJ,ABC,USD,BVH,PLY,STL,FBX和X3D。这种适应性使其成为各种3D项目和工作流程的宝贵工具。(https://www.blender.org/download/)。
972 0
|
2月前
|
存储 并行计算 算法
CUDA性能优化实战:7个步骤让并行归约算法提升10倍效率
https://avoid.overfit.cn/post/af59d0a6ce474b8fa7a8eafb2117a404
169 1
CUDA性能优化实战:7个步骤让并行归约算法提升10倍效率
|
11月前
|
数据采集 存储 监控
如何使用 Python 爬取京东商品数据
如何使用 Python 爬取京东商品数据
511 2
|
API PyTorch 算法框架/工具
PyTorch 2.2 中文官方教程(九)(3)
PyTorch 2.2 中文官方教程(九)
443 0
PyTorch 2.2 中文官方教程(九)(3)
|
前端开发
Vue3——使用deep进行样式穿透的时候发出v-deep警告
Vue3——使用deep进行样式穿透的时候发出v-deep警告
231 3
|
SQL 分布式计算 Java
Spark学习---SparkSQL(概述、编程、数据的加载和保存、自定义UDFA、项目实战)
Spark学习---SparkSQL(概述、编程、数据的加载和保存、自定义UDFA、项目实战)
722 1
|
开发工具 Android开发 git
全志H713 Android 11 :给AOSP源码,新增一个Product
本文介绍了在全志H713 Android 11平台上新增名为myboard的产品的步骤,包括创建新的device目录、编辑配置文件、新增内核配置、记录差异列表以及编译kernel和Android系统的详细过程。
932 0
|
消息中间件 存储 缓存
【架构设计】酒店预订应用程序的系统设计架构(如 Airbnb、OYO)
【架构设计】酒店预订应用程序的系统设计架构(如 Airbnb、OYO)
|
定位技术 API
Cesium开发:常用地图事件
Cesium开发:常用地图事件
482 0
|
JSON 缓存 前端开发
MapStruct,降低无用代码的神器
在学习《告别BeanUtils,Mapstruct从入门到精通》后,我发觉MapStruct确实是一个提升系统性能,降低无用代码的神器。然而,在实践这篇文章过程中,我遇到了些问题,并由此对MapStruct框架有了更深入的理解,以下将我的学习收获分享给大家。
793 1
MapStruct,降低无用代码的神器