vue3教程共12篇
vue3教程

Vue3-pinia

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

Vue3 基础第一篇

Vue3 基础第一篇-智码星河
vite创建项目 1.安装Node:Vite 需要 Node.js 版本 >= 12.0.0。 2.然后执行:npm init vite@latest 创建vite+vue项目 在命令行输入以下创建语句。然后根据下图所示,输入项目名称并选择vue框架 ...
青栀的头像-智码星河青栀6个月前
011214

Vue之封装请求详解

Vue之封装请求详解-智码星河
一. 创建vue脚手架项目 二. 安装axios   三. 封装请求 大致思路: 就是新建一个request的文件夹,里面有两个js文件,分别是request.js和 api.js  前者是配置请求的根...
青栀的头像-智码星河青栀6个月前
010114

Vue前置导航守卫

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

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

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

Vue3 基础第三篇

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

vue3的计算属性computed

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

vue3的hooks

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

创建vue3(npm create vue@latest)

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

Vue3之setup

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