当前位置:   article > 正文

vue router打开新页面并传递参数,接收参数_this.$router.resolve传params

this.$router.resolve传params

a页面 跳转到 b页面

未跳转的之前页面(a页面)下代码:

const { href } = this.$router.resolve({
	name: 'contentArticle', //需要打开的新页面vue的名字
	query: {
	id: id   //携带的参数,多个使用,隔开
	}
});
window.open(href, "_blank");//跳转
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

需要跳转到的新页面(b页面)下的代码

data() {
   return {
	id: '',
   };
},
created(){
	this.getParams();
},
methods: {
	getParams () {
		// 取到路由带过来的参数
		var routerParams = this.$route.query.id;
		// 将数据放在当前组件的数据内
		this.id = routerParams;
	 },
}
watch: {
	// 监测路由变化,只要变化了就调用获取路由参数方法将数据存储本组件即可
	'$route': 'getParams'
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
声明:本文内容由网友自发贡献,转载请注明出处:【wpsshop】
推荐阅读
相关标签
  

闽ICP备14008679号