vue路由跳转方式

原文链接

一、vue路由跳转方式以及传参方式 1、route-link

// router-link中链接如果是'/'开始就是从根路由开始，如果开始不带'/'，则从当前路由开始。
// 不带参数
<router-link :to="{name:'home'}"> 
<router-link :to="{path:'/home'}"> 
// 带参数
<router-link :to="{name:'home', params: {'参数名': ’参数值‘}}">  
<router-link :to="{name:'home', query: {'参数名': ’参数值‘}}">

2、router.push 3、router.replace

和router.push用法类似，跳转到指定的url，history栈中不会有新增的记录，跳转离开再回退，返回的是上上一个页面

4、router.go

this.$router.go(n) 
// n正整数是前进，负整数是后退

二、$ router和$ route的区别

$router : 是路由 *** 作对象，只写对象
$route : 路由信息对象，只读对象

$router *** 作路由跳转

this.$router.push({ name:‘hello’, params:{ name:‘word’, age:‘11’ } })

$route读取 路由参数接收

var name = this.$route.params.name;