路由跳转的方式有哪几种 和 路由传值的方式有哪几种
来源：
本站
发布时间：
2021-03-07 22:10
阅读次数：
路由跳转的方式有哪几种？
1、a 标签进行跳转。例如<a href="http://17design.cn/#/home">首页</a> 2、router-link 进行跳转 例如：<router-linkt to="/home">首页< router-link>
3、编程式路由 例如：this.$router.push()
路由传值的方式有哪几种
1、动态路由传值。例如：path:"/home/:id/name"; 接受的时候通过 this.$route.params
2、query 传值。因为在 url 中？后面的参数不会被解析，因此我们可以通过 query 进行传值。接受的时候通过this.$route.query
3、路由解耦。在配置路由的时候添加 props 属性为 true,在需要接受参数的组件页面通过 props 进行接受
字符串 router.push('home')
对象 router.push({ path: 'home' })
命名的路由 router.push({ name: 'user', params: { userId: '123' }})
带查询参数，变成 /register?plan=private
router.push({ path: 'register', query: { plan: 'private' }})
声明式: <router-link :to="..." replace=""> 编程式: router.replace(...)
4、编程式导航 this.$router.push({path:"/home",query:{}});</router-link></router-linkt>
path:跳转路径
component:路径相对于的组件
name:命名路由
meta:路由元信息
children:子路由的配置参数(路由嵌套)
props:路由解耦
redirect:重定向路由
路由跳转：this.$router.push()
路由替换 :this.$router.replace()
后退：this.$router.back()
前进：this.$router.forward()
$route是“路由信息对象”，包括path，params，hash，query，fullPath，matched，name等路由信息参数。
$router是“路由实例”对象包括了路由的跳转方法，钩子函数等。
一起设计吧
