Vue中this.$router.push()路由跳转页面并传值最常见两种方式
1. query传参//query传参//传值this.$router.push({ name: 'orderList', query: { conlltion: id }})this.$router.push({path:'/orderList',query: {conlltion: id }})// html取值$route.query.conlltion// scr...
·
1. query传参
// query传参
// 传值
this.$router.push({ name: 'orderList', query: { conlltion: id }})
this.$router.push({path:'/orderList',query: {conlltion: id }})
// html取值
$route.query.conlltion
// script取值
this.$route.query.conlltion
2. params传参
// params传参
// 传值
this.$router.push({ name: 'orderList', params: { conlltion: id }}) // 只能用 name
// html 取值
$route.params.conlltion
// script 取值
this.$route.params.conlltion
区别
两种方式的区别是query传参的参数会带在url后边展示在地址栏,params传参的参数不会展示到地址栏。
扩展
1.需要注意的是接收参数的时候是route而不是router。两种方式一一对应,名字不能混用。
2.由于动态路由也是传递params的,所以在 this.$router.push() 方法中path不能和params一起使用,否则params将无效。只能用name来指定页面。
3.不带参数,直接跳转页面
this.$router.push('/orderList')
this.$router.push({name:'orderList'})
this.$router.push({path:'/orderList'})
更多推荐
已为社区贡献1条内容
所有评论(0)