vue-router传递参数

vue-router传递参数分为两种：

1、编程式导航：this.$router.push()

（1）、命名路由传递参数需要使用params来传递，目标页面接收传递参数时使用params。

　　特别注意：命名路由这种方式传递的参数，如果在目标页面刷新是会出错的

　　params配合name使用

　　传递参数如下：

 

 页面接受参数如下:

 

 

（2）、查询参数其实就是在路由地址后面带上参数和传统的url参数一致的，传递参数使用query而且必须配合path来传递参数，目标页面接收传递的参数使用query。刷新页面不会出错

　　query配合path使用

　　传递参数如下：

 

 页面接受参数如下:

 

 

2、声明式导航：<router-link to=""></router-link>（跟上面规则其实一样就是写法不同罢了）

（1）、命名路由传递参数需要使用params来传递，目标页面接收传递参数时使用params。

 

 （2）、查询参数其实就是在路由地址后面带上参数和传统的url参数一致的，传递参数使用query而且必须配合path来传递参数，目标页面接收传递的参数使用query。刷新页面不会出错