路由参数传递
Posted kanaliya
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了路由参数传递相关的知识,希望对你有一定的参考价值。
传递参数主要有两种类型:params及query
params的类型:
1.配置路由格式:/router/:id
2.传递方式:在path后面跟上对应的值
3.传递后形成的路径:/router/123 /router/abc
使用router-link:
<router-link :to="{name:'profile',params:{id:1}}">档案</router-link>
使用代码的方式:
this.$router.push({name:'profile',params: {id:1}})
注意:在添加params对象时,必须搭配使用name(此时不用在router下index.js中对应路由的path内配置‘/:参数‘),而不能使用path,否则在接收参数时无法接收到参数值;如果一定要使用path,则无需使用params,即使添加params对象也没有效果,直接在path在后面以‘/参数‘的形式添加参数,同时在router下index.js中对应path后添加‘/:参数‘即可
接收参数时使用$route.params
query类型
1.配置路由格式:/router,即普通配置
2.传递方式:对象中使用query的key作为传递方式
3.传递后形成的路径:/router?id=123,/router?id=abc
使用router-link:
<router-link :to="{path:'/user',query:{id:'1'}}">档案</router-link>
使用代码的方式:
this.$router.push({name:'user',query: {id:'aaa'}})
使用query参数时,使用name或者path均可
接收参数时使用$route.query
以上是关于路由参数传递的主要内容,如果未能解决你的问题,请参考以下文章