PrimeVue初识

PrimeVue初识

新出的Vue UI 框架真的不少,大多数质量都挺高,最近接触了两个新的框架,一个是PrimeVue,一个是HeadlessUI,这个库也是历经了很多版本,目前东西挺丰富,这里先记录一下PrimeVue,HeadlessUI踩坑刷了鞋再来。PrimeVue官网在这里

优势

源码简单

相信很多想你收前端同学都想看着源码提高自己,但是以我五年的前端经验,我看ElementUI还是费劲,可能是我太菜了吧,看源码我认为主要还是看框架作者的思路和用法,这点PrimeVue做的真的不错,它的组件编写甚至没有用CompsitionAPI,而是传统的Option方式,这有点反"尤"。😀😀😀,组件够纯粹,够简单,屎遁的时候甚至都能看两下学学。

样式够灵活

PassThrough

对于经常做项目的同学来说,使用一个框架需要经常修改框架的CSS,我通常是用单独的文件来管理,最后合并到一个类似global.scss之类的文件中,PrimeVue为我们提供了直接修改样式的方式,甚至可以通过setup上下文得到响应式数据来修改,这里他提供的PassThrough方式确实惊艳. 拿一个按钮来说,文档中直接提供了他的线框图。

接着我们可以在全局或者组件内部根据线框提供的PT Options直接定义样式。或者在全局提供globalCSS变量直接覆盖其已有的样式,方便维护。

Theming

修改主题大家天天干吧,PrimeVue提供了Stlyed Mode,有内置包括MD规范,Bootstrap,LAVA UI,等预设,还提供了Unstyled Mode,即组件只包含逻辑,无任何样式,可以通过TailwindCSS定义,或者让你们的UI姐姐们忙起来吧,😀😀😀。Styled Mode内置了样式修改器,修改的样式可以下载,并且通过内置函数可以一键切换,逻辑也很简单,就是对link文件增删。

PrimeFlex

大家配置TailWindCSS或者WindiCSS是不是有时候挺头疼,PrimeVueFLex直接内置了部分常用的AtomCSS样式,看图熟悉吧,用就完事了。

组件库够丰富

大部分大家用到的组件全齐,偏门一点包含但不限于下拉树,富文本,类苹果菜单,假控制台,等等很多,平时忙于业务的同学们,想做页面简单一点,用就完事了。

劣势

我使用了一个多月,几乎天天用,看文档,大家也知道用一个UI库会渐渐发现问题,到目前我整理了小部分,以后有再接着记录。

全英文

这里省略,同学们自行翻译。

表单孱弱

这个库的表单和Element UI等主流框架比起来就是个臭弟弟,样式几乎没有,直接用组件自己拼接,最要命的是没有内置的校验库,官方推荐的是Vee Validate但是这个库除了页面做的比较好以外,啥也不是。不但要绑架你的form还试图干扰你对表单数据做的一切工作,介入太强了,我不喜欢,我喜欢数据全部自己handle,而且文档完全看不懂。我目前是采用Vuelidate这个库,校验够简单,如果不行,加入yup估计也够用了。

bug

这个库更新的速度是比较快的,因为组件很多会导致bug的数量也不少,但是好在作者团队一直在维护,也得益于库有💴💴进账,Figma也有同步的设计库,这个问题倒是不大,如果只能在内网开发,导包费劲的同学请斟酌。

后面我会陆续更新组件的使用和踩坑记录,希望这个框架能帮助到大家。

相关推荐
一个风轻云淡30 分钟前
GCC 和 GDB命令简单解读
java·linux·前端
u0111026751 小时前
图片处理接口如何统一错误信息 前端提示与后端错误码设计
前端·状态模式
福兮说2 小时前
浏览器里把 iPhone 的 HEIC 转成 JPG:Chrome 解不开、转完大了七成、拍摄时间全丢,六个坑实测
前端·javascript·图像处理·chrome·ios·iphone·heic
libokaifa2 小时前
把语音模型塞进手机:sherpa-onnx 在 Android 上的 ASR / TTS
前端
deli0072 小时前
DLA 枝晶生长实测:5000 个粒子集体停摆之后,分形维数收敛到 1.70
前端
IT_陈寒2 小时前
Redis卡顿的锅,这次真不是大key的错
前端·人工智能·后端
可乐鸡翅yeah_3 小时前
video.js 集成 hls.js 开发 M3U8 播放器,新手高频踩坑
开发语言·前端·javascript·后端·ecmascript·m3u8·音视频在线播放
程序猿追3 小时前
HarmonyOS 6 上做个极简浏览器:Web 组件 + 前进后退 + 加载进度
前端·华为·harmonyos
沐沐师3 小时前
Mybatis 框架教程
前端
三天不学习3 小时前
Tailwind CSS 快速入门(2026 版):从 v4 零配置上手,到「该不该用、怎么用好」的选型实战
前端·css·tailwind