vue技术栈进阶(03.路由进阶)

路由参数传参

1)布尔值的方式

路由文件中设置属性
在这里插入图片描述
2)对象的方式
在这里插入图片描述

3)函数的方式

在这里插入图片描述
然后在组件中接收
在这里插入图片描述

HTML5 History 模式

在这里插入图片描述
未找到的页面处理
在这里插入图片描述

导航守卫

*全局守卫

1)全局前置守卫:在开始跳转和跳转完成前执行
在这里插入图片描述
2)全局后置钩子:在跳转完成之后执行
在这里插入图片描述

*路由独享 守卫:在跳转完成之前

在这里插入图片描述

*组件 守卫:

渲染组件之前
在这里插入图片描述
离开之前
在这里插入图片描述
组件复用时: 就是再次访问此页面,传递不同的参数是调用
在这里插入图片描述

导航解析全过程

在这里插入图片描述

路由元信息(每个相关这个路由元素的信息)

定义在路由列表中
在这里插入图片描述
定义一个处理业务逻辑的函数 ,在lib/util中存放根业务逻辑相关的函数
在这里插入图片描述
主路由文件中引入函数,并且在全局路由守卫中进行调用
在这里插入图片描述
在这里插入图片描述

过渡效果(在根组件中设置)

页面加载和页面离开时的效果(即组件加载和组件销毁的效果)
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

原文地址:https://www.cnblogs.com/jackson1/p/12715835.html