vue3-router使用（全）

说明一、定义路由二、导入组件三、 传参四、 守卫五、编程式路由完

router设计核心是一个路由对应一个组件

本教程需要有一定router基础定义路由导入组件传参守卫编程式路由

自定义路由

{
path:......,
name:......,
component:......
}

子路由

{
path:......,
children:[
{
path:......,
name:......,
component:......
},
......
]
}

注：path相对路径和绝对路径
相对路径：只写字路由
绝对路由：全路由

全局导导入

import ...... from ......

惰性导入

()=>import(......)

传统传参

字符串传参

对象传参

router-link to="{
	path | name:......, //用path时就是路径，是name时就是定义的路由名
	query:{......}
}"

Rest传参

定义 path:“url/:var/:var…”对象传参

context

取值（路由对象route）
this.$route.query
this.$route.params
route其它属性
name
path
fullpath
meta
query
params

注：在根组件index.js中创建

router.beforEach((to,from,next)=>{
	to.path //去的路由
	from.path //来的路由
	next() //下一个函数
	next(path) //指向路由
})

this.$router.push(path) 指定路由
this.$router.forword() 向前一步
this.$router.back() 向后一步
this.$router.go(n) 向前或向后几步