Vue中路由传参

Vue中路由传参

按大类有两种传递方式，分别是params和query。
其中params又分为两种,即在url中显示参数和不显示参数。
1、params传参，显示参数：
这种情况属于动态路由，需要提前在路由中配置好，
如：｛path：“user/：id”，component：user｝，
如id为12345，这时导航栏中的url会显示/user/12345，在页面中获取多传id的方式为this.$route.params.id；这种传参方式实际上是resultful风格的传递方式。2、url传参，不显示参数如：this.$router.push{name:“user”,params:{id:12345}
需要注意一点，这里只能用name而不能用path
这时在路由导航中url只显示位/user，并不会显示后边的参数12345。在页面中获取id的方式同上。
3、query、显示参数
如：
this.$route人.push（name：“user”，query：｛id：12345｝，\ast 注意这里name也可以用path定位到组件，但建议统一使用name\ast 在页面上获取id的方式为this.$router.query，这时在路由导航中url会显示为/user?id=12345
上面就是路由传参的几种方式，这里再补充一点关于url的组成：
协议+hostname+端口号（默认8080一般省略）+path+query查询（格式为：？key=value）