Category: Vue专题

18 篇文章

Vue3组件名称重定义
Vue2升级Vue3之后,可能会发现一个问题,以前Vue2中经常使用的组件名称不见了,其实Vue3默认用文件名称作为组件名,也是就是说: MyComp.vue文件组件的名字就是MyComp,如何自定义组件名称呢? 定义组件名 Vue3也可以支持类似选项式API那样的格式,可以和以前一样定义组件名,也可以用组合式语法定义 setup函数 直接用nam…
新Vue3常见问题与技巧整理
Vue3已经发布很长时间了,最新版本已经到了3.4.x(2023-12月底开始升级到3.4),功能基本稳定。 Vue官网:https://cn.vuejs.org/ 选项式与组合式 首先看到Vue3最先可能需要的是选择选项式还是组合式API,这两种都是Vue3支持的开发模式,可以根据习惯来选择,不过组合式是最新的模式,建议新项目都是用组合式API,…
简单理解Vue2和Vue3响应式原理
Vue是前端比较火的开发框架,Vue修改数据后能够立马在页面上反应出最新的修改结果,这种就叫数据响应式,本文讲解一下Vue响应式原理,理解Vue背后的逻辑。 有一定开发经验的应该知道如果要修改数据时执行其他业务逻辑,通常需要通过拦截器来实现。 Vue2响应式 Vue2响应式原理是通过Object.defineProperty实现,这个方法可以给对象…
JS和ES6基础与常用技巧
AI摘要 这篇文章深入介绍了 JavaScript 和 ES 基础知识以及常用技巧。文章首先讨论了变量基础,包括不同的声明方式和常用数据类型。接着详细解释了变量声明、作用域、相等判断和空数据判断等内容。随后,文章介绍了对象和数组的操作方法,并讨论了常见的字符串拼接和简单类型转换技巧。此外,文章还涉及了网页定时任务、Promise、函数与箭头函数、模…
从零搭建基于element-plus的Vue3项目06——实现多Tab页面
目前很多后台管理框架都支持多TAB模式,效果如下: 因此我们这也要支持多个TAB,要支持多个TAB,需要存储多个TAB页面的名称等信息。 此功能相对比较复杂,难度较大 基本功能设计 支持功能: 支持TAB名称和图标展示 支持TAB关闭 TAB支持右键菜单,可以关闭多个TAB 用KeepAlive缓存TAB状态 关闭后KeepAlive缓存移除 父子…
从零搭建基于element-plus的Vue3项目05——统一图标封装
element-plus已经自带部分图标,不过图标数量并不多,因为是后台系统,可以考虑集成更多的图标,这里选择xicons图标库里面的material图标库。 目前图标库基本都是用组件的形式来使用图标,开始已经集成了element-plus的图标,这里要安装xicons。 地址:https://www.xicons.org/#/ 安装xicons图…
从零搭建基于element-plus的Vue3项目03——Pinia状态管理
Pinia状态管理 目前Vuex已经不推荐使用,4.x是最后一版,已经不会有新版本,Pinia实际就是Vuex 5,因此推荐使用Pinia作为状态管理,其实Pinia使用比Vuex要简单。实际已经在生成项目的时候已经是集成了Pinia。 地址:https://pinia.vuejs.org/zh/introduction.html Pinia简单对…