vue 跳转携带的参数如何获取_Vue页面跳转，携带参数及参数获取相关方法总结...

利用vue框架开发项目的时候，难免会遇到页面跳转，携带参数的需求，总结一下在项目遇到一些日常需求和解决方式。

通过连接传递参数，参数链接可见：

this.$router.push({name: 'b页面'，query:{userId: 123}}) //跳转到b页面，携带参数useId.

这里参数可以在链接可见，然后就可以通过截取链接参数名来获取参数了，具体函数：

export function getParameterByName(name) {

name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');

const regex = new RegExp('[\\?&]' + name + '=([^]*)');

const results = regex.exec(location.href);

return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));

}

页面引入该函数，直接getParameterByName(‘userId’)，就ok了。

还有一种，携带参数，链接不可见，确保页面安全性。

this.$router.push({name: 'b页面'，params:{userId: 123}}) // 跳转b页面，参数链接不可见

这种方式传递的参数获取更加简单，只需要在b页面中定义一个变量：

let id = this.$router.params.userId;

就拿到相应的参数了。

当然还有通过来跳转的：

跳转b页面

获取参数值同样的只需要定义变量就行了。