学习Vue(4)

~insn~

于 2023-06-25 19:17:55 发布

阅读量274

点赞数

文章标签： vue.js 学习 javascript

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/m0_53313913/article/details/131029067

版权

路由

实现的是SPA应用，单页面应用
vue-router4用于vue3
vue-router3用于vue2

简介

在这里插入图片描述

基本使用

main.js
在这里插入图片描述

在这里插入图片描述

模式设置

在这里插入图片描述

注意点

在这里插入图片描述

组件

一般组件

自己写上去的组件

路由组件

使用router跳转展示的组件

多级路由

注意children里不加斜杠
在这里插入图片描述

总结

在这里插入图片描述

路由传参

？后面才是参数
在这里插入图片描述
这样来的

在这里插入图片描述

参数传参

在这里插入图片描述

query

在这里插入图片描述

总结

在这里插入图片描述

params参数

在这里插入图片描述

这里只能用name,用path就要报错。

总结

在这里插入图片描述

命名路由

在这里插入图片描述

在这里插入图片描述

总结

在这里插入图片描述

props

对象写法

用得不多，si数据

在这里插入图片描述

设为true

在这里插入图片描述

props为函数

在这里插入图片描述
解构赋值

在这里插入图片描述
连续解构赋值

按钮实现跳转和前进后退

调用this.router上的方法

在这里插入图片描述

独有的生命钩子

activated()

组件被激活，时调用

deactivated()

组件失活了时被调用

路由守卫

前置路由守卫

在这里插入图片描述

后置路由守卫

可以设置title
在这里插入图片描述

独享路由守卫

只有前置
在这里插入图片描述

通过路由规则

用得不多

在这里插入图片描述

两种mode

在这里插入图片描述

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。