vue3教程共12篇
vue3教程

Vue3 基础第二篇

Vue3 基础第二篇-智码星河
vue3相对vue2: 重写了虚拟Dom实现,编译模板的优化,更高效的组件初始化,undate性能提高1.3~2倍,SSR速度提高了2~3倍,体积减小,组合式api更易维护,更好的Typescript支持,更接近原生,响应...
青栀的头像-智码星河青栀12个月前
01397

Vue3 基础第三篇

Vue3 基础第三篇-智码星河
声明数据要这样写,把数据集中放在一个对象中: let state = reactive({ typeList: [], arr:[] }); 如果没用setup语法糖,那么这个state需要return,state.arr这样的写法太麻烦, 这样直接 retu...
青栀的头像-智码星河青栀12个月前
015511

Vue3创建项目(一)新手教程

Vue3创建项目(一)新手教程-智码星河
整理一下Vue3创建项目,新手教程,看完需要预计花费10分钟。 🍓使用命令创建项目 1.环境准备 Vue依赖NodeJs的环境,需要先安装Nodejs。 2.NodeJs安装 打开NodeJs下载页 选择自己系统对应的版本...
三年没洗澡的头像-智码星河钻石会员三年没洗澡12个月前
010212

Vue前置导航守卫

Vue前置导航守卫-智码星河
前置路由守卫常用于项目在未登录时的跳转判断,不管是vue2还是vue3都是一样的用法,没有多少改变,路由守卫有好几种,写法也有几种,以下是最简单且最常用的一种。 判断用户是否登录需要在 ...
青栀的头像-智码星河青栀11个月前
015813

创建vue3(npm create vue@latest)

创建vue3(npm create vue@latest)-智码星河
1.桌面右键选择终端打开,输入npm create vue@latest 2.可能会出现报错: 其实是node版本不对 node的多版本管理中, 使用命令nvm list查看多个node版本 再使用nvm use 版本号切换版本 3.创建并...
青栀的头像-智码星河青栀12个月前
01668

Vue3-pinia

Vue3-pinia-智码星河
— 前提准备 — 项目根目录下载安装pinia npm i pinia 准备一个vue页面,如a.vue <template> <!-- 这是一个空的vue文件 等会用于测试pinia管理的公共数据 --> </template> <script s...
青栀的头像-智码星河青栀12个月前
015515

vue3的计算属性computed

vue3的计算属性computed-智码星河
老例子了,计算姓名: 改姓和名 能响应全名  改全名无法响应姓或名 单向: 完整的写法: 这样就是双向响应: 完整代码: <template> 姓:<input type='text' v-model='person.xing'> <...
青栀的头像-智码星河青栀12个月前
01609

Vue3之setup

Vue3之setup-智码星河
vue3是在vue2的基础上做了一些更新,所以学vue3只是在vue2的基础上对某些东西的知识更新。在vue3的里面有些并不推荐使用的vue2的方法属性依然能使用,这个需要分清楚。 vue3里面一个最大的特点...
青栀的头像-智码星河青栀12个月前
01467

vue3的hooks

vue3的hooks-智码星河
这个东西相当于vue2的mixins,相比mixins,hooks更清楚复用功能代码的来源。就是把繁多的js功能拆分成单个的js文件,然后再引入到需要的地方使用。 在src目录下新建一个hooks的目录,所有拆分的...
青栀的头像-智码星河青栀12个月前
01369

vue3的生命周期和编程式导航

vue3的生命周期和编程式导航-智码星河
vue3的生命周期: vue3的生命周期基本和vue2一样,只是最后一个钩子函数名字改变了。用法上可以和vue2一样作为配置项去使用完全可以,也可以使用组合式api在setup函数里面使用。 值得注意的是,...
青栀的头像-智码星河青栀12个月前
01287