Vue中的 this.$router.push() 参数获取 （通过路由传参）

Vue中的 this.$router.push() 参数获取 （通过路由传参）

传递参数的方法：
1.Params

由于动态路由也是传递params的，所以在 this.$router.push() 方法中 path不能和params一起使用，否则params将无效。需要用name来指定页面。

及通过路由配置的name属性访问

通过name获取页面，传递params：

　　login () {
let data = {
"TenantId": $TenantId,
"LoginIdOrPhone": this.phone,
"HashedPassword": md5(this.password+"lo0.1l@g9v#"),
"VerifyCode": "",
"DeviceType": 0,
"ClientId": "string",
"Application": $Application
}
this.$http.post("api/base/account/login",data).then( res => {
console.log(res)
if(res.data.Code == 0 ){
//当前路由指向name=homePage的组件
this.$router.push({ name: 'homePage', params: {code : res.data.Code } })

localStorage.setItem("token", res.data.Data.SessionKey);
}else if(res.data.Code == 1){
let instance = Toast(res.data.Message);
setTimeout(() => {
instance.close();
}, 2000);
}
})
}

在目标页面通过this.$route.params获取参数：

<template>
<div>我是首页 {{params}}</div>
</template>
<script>
export default {
data () {
return {
params : this.$route.params.code
}
},
mounted () {
alert(this.$route.params.code)
}
}
</script>
<style lang="sass" scoped>

</style>