vue路由传参及路由的几种跳转方式

路由传参有两种方式

1、字符串拼接
在路由里写下传参数
在跳转页面 this.r o u t e r . p u s h ( ) 写 下 路 径 并 用 router.push()写下路径并用router.push(){传的参数}
在这里插入图片描述
在这里插入图片描述
2. 路径后面直接+?参数

在这里插入图片描述
两种方式都可以用this.$route查询到参数

vue路由传参的几种方式

1.this.$router.push()

//不带参数跳转
this.$router.push("/register")

//路由通过path携带query参数进行页面的跳转,路由显示
this.$router.push({path:"/detail",query:{id:123456}})

//路由通过name携带params参数进行页面的跳转,页面刷新参数会丢失
this.$router.push({name:"ListDetail",params:{id:123456}})

2.this.$router.go( )

// 后退一步记录,等同于 history.back()
this.$router.go(-1);

// 在浏览器记录中前进一步,等同于 history.forward()
this.$router.go(1);

3.this.$router.replace

跳转到指定url路径,但是history栈中不会有记录,点击返回会跳转到上上个页面
this.$router.replace('/register')


版权声明:本文为duidandan原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。