vue3.0
文章平均质量分 91
近期项目框架升级vue3.0记录
qbbmnnnnnn
这个作者很懒,什么都没留下…
展开
-
【VUE3.0】动手做一套像素风的前端UI组件库---Message
本篇完成的组件为Message,日常项目中较为常见的组件,主要涉及到的内容有:这次没得 抄 借鉴了,NES.css没有提供这个组件的样式模板。参考按钮的高光和阴影设计一个具有特色的信息弹窗。利用vue的transition组件给弹窗一些动画效果。采用单例模式将信息弹窗放置在全局避免重复。参考组件库Element Plus的设计使用方式,采用js的方式调用组件并传参。原创 2024-09-24 23:19:44 · 1367 阅读 · 1 评论 -
【VUE3.0】动手做一套像素风的前端UI组件库---Radio
本篇复现的组件为radio,日常项目中较为常见的组件,主要涉及到的内容有:参考NES.css进行基础样式构建,使用css模拟箭头指示器。点击动效设计,利用animation的animation-timing-function属性模拟指示器闪动效果。参考组件库Element Plus的设计使用方式,利用vue的slot插槽复现组件调用方式。设置禁用模式和change事件。原创 2024-09-22 17:07:50 · 1195 阅读 · 0 评论 -
【VUE3.0】动手做一套像素风的前端UI组件库---Button
本篇复现的组件为button,日常项目中较为常见的组件,主要涉及到的内容有:基础样式构建。点击动效设计。参考市面上常见组件库的设计,根据type切换颜色。设置禁用模式。原创 2024-09-19 00:53:12 · 1383 阅读 · 0 评论 -
【VUE3.0】如何得到一张像素风格的图片?
像素风图片是一种以像素为基本单位的图像风格。在数字图像中,每一个像素实际上就是一个小方块,它有自己的颜色。在早期的计算机图形学中,由于硬件限制,图像分辨率较低,因此图像由较大且明显的像素组成。随着时间的发展和技术的进步,虽然我们可以创建更高分辨率的图像,但是像素艺术(Pixel Art)作为一种复古的艺术形式依然受到许多人的喜爱。原创 2024-09-18 00:06:12 · 946 阅读 · 0 评论 -
【VUE3.0】动手做一套像素风的前端UI组件库---先导篇
我将在接下来的几篇文档中,完成以下几个内容:1. 参考NES.css研究各类组件样式如何编写。2. 基于vue3框架编写组件库。3. 将组件库发布npm仓库提供下载。原创 2024-09-18 00:03:50 · 966 阅读 · 0 评论 -
【VUE3.0】封装Echarts的hooks函数
按需引入可以依据业务需求,将所需的组件导入,以及选择合适的渲染器,避免打包时将两种渲染器均打包到bundle里。不过又引出一个问题,每个业务组件都需要按照当前的图表类型,将大部分重复小部分差异的echart组件导入业务页面中去,无疑又新增了心智负担。而hooks函数的出现就是为了解决这类问题原创 2024-09-12 17:39:53 · 1188 阅读 · 0 评论 -
【VUE3.0】聊聊Vue中的Hooks
1. 在 Vue 3 中引入了 Composition API,hooks 是一种特殊的函数,它们可以让你在组件中访问 Composition API 的功能。Vue 中的一些常见 hooks 包括: - ref:创建一个响应式的引用。 - reactive:创建一个响应式的对象。 - computed:基于其他数据计算得出的数据属性。 - watch 和 watchEffect:监听数据变化并执行副作用。 - 生命周期相关的 hooks,例如 onMounted, onBeforeMount,原创 2024-09-12 11:39:16 · 1519 阅读 · 0 评论 -
【VUE3.0】解决element button在plain模式下icon无法反色问题
在SvgIcon组件封装的介绍文档末尾提到了一些隐患问题,在这篇文档里做一个收尾。SvgIcon组件封装。解决自定义svgicon组件无法在button plain模式下中处理反色问题。原创 2024-09-05 22:32:34 · 444 阅读 · 0 评论 -
【VUE3.0】vue3 + vite项目封装svg组件,拓展项目icon库
element plus icon组件库自动引入有问题,且使用格式不好用,全量引入icon方法比较简单,但是会引入多余的icon,如果项目上需要其他的icon没法相同格式合并。使用vite-plugin-svg-icons插件,封装项目svgicon组件,方便拓展和使用。原创 2024-09-05 20:13:53 · 936 阅读 · 0 评论