vue 路由跳转、传参、新窗口打开页面
跳转方式1、this.$router.push 当前页面跳转,新增history记录,点击后退,返回上一级页面①参数直接拼接在后面:this.$router.push('/nextPage?name=name&id=111')// 当前页面跳转接收参数:this.$route.query // 全部参数②路径写在name里面,params传参,这种方式前面不需要加‘/’this.$rout
·
跳转方式
1、this.$router.push 当前页面跳转,新增history记录,点击后退,返回上一级页面
①参数直接拼接在后面:
this.$router.push('/nextPage?name=name&id=111') // 当前页面跳转
接收参数:
this.$route.query // 全部参数
②路径写在name里面,params传参,这种方式前面不需要加‘/’
this.$router.push({ name: 'highcharts', params: { name: 111, id: 222 } })
使用:this.$route.params 接收参数
③ query传参 this.$route.query 接收参数
this.$router.push({ path: "/highcharts", query: { username: "jack" } });
2、this.$router.replace('url?name=') // 替换history的最后一个页面,点击后退回到上上个页面,其他与this.$router.push基本一样
3、this.$router.go( );
this.$router.go( -1 ); // 后退一步记录,等同于 history.back()
this.$router.go(1); // 在浏览器记录中前进一步,等同于 history.forward()
新窗口打开页面
let { href } = this.$router.resolve({
path: "/highcharts",
query: { username: "jack" }
})
window.open(href, '_blank')
更多推荐
已为社区贡献3条内容
所有评论(0)