vue路由带参跳转至新页面的三种方式：

方式一：
使用path来匹配路由，然后通过query来传递参数，这种情况下 query传递的参数会以?id=XXX的形式显示在url后面

goToPage(id) {
	let routeData = this.$router.resolve({ 
		path: "/projectrecommendation",
	    query: { 
	    	id:id
	     }
	});
	
	//必要操作，否则不会打开新页面
	window.open(routeData.href, '_blank');    
}

需要配置对应的路由如下：

{
     path: '/projectrecommendation',
     name: 'projectrecommendation',
     component: projectrecommendation
}

在子页面中可以使用以下方式获取传递的参数值：

this.$route.query.id

方式二：
使用name来匹配路由，然后通过query来传递参数，这种情况下 query传递的参数会以?id=XXX的形式显示在url后面

goToPage(id) {
	let routeData = this.$router.resolve({ 
		name: "projectrecommendation",
	    query: { 
	    	id:id
	     }
	});
	
	//必要操作，否则不会打开新页面
	window.open(routeData.href, '_blank');    
}

需要配置对应的路由如下：

{
     path: '/projectrecommendation',
     name: 'projectrecommendation',
     component: projectrecommendation
}

在子页面中可以使用以下方式获取传递的参数值：

this.$route.query.id

方式三：
通过路由属性中的name来确定匹配的路由，通过缓存来传递参数

goToPage(id) {
	let routeData = this.$router.resolve({ 
     	name: "projectrecommendation"
    });

	//因为在子页面内使用this.$route.params拿到的对象为{}，参数无法传过来，所以需要将参数记录到缓存中，在新页面中 通过缓存来拿
	localStorage.setItem("geoId", id)；  

	//必要操作，否则不会打开新页面
	window.open(routeData.href, '_blank');    
}

需要配置对应的路由如下：

{
     path: '/projectrecommendation',
     name: 'projectrecommendation',
     component: projectrecommendation
}

在子页面中可以使用以下方式获取传递的参数值：

if (localStorage.getItem('geoId')){
	//从缓存中读取参数
    let  keywords= localStorage.getItem('geoId') || ""; 
	//读取参数后，删除
    localStorage.removeItem('geoId');
 };

注意：
（1）因为在子页面内使用this.$route.params拿到的对象为{}，参数无法传过来，所以需要将参数记录到缓存中，在新页面中通过缓存来拿

如有漏洞，欢迎互动指教！！！！！！！！！！！！！