vue的頁面跳轉方式和傳值、取值
阿新 • • 發佈:2021-08-13
1、通過router-link進行跳轉,傳遞方式:
使用query傳遞引數,路由必須使用path引入,
使用params傳遞引數,路由必須使用name引入
<router-link :to="{path: '/home', query: {key: 'hello', value: 'world'}}"> <button>跳轉</button> </router-link>
//跳轉地址 ====> /home?key=hello&value=world
//取值 ====> this.$route.query.key<router-link :to="{name: '/home', params: {key: 'hello', value: 'world'}}">
<button>跳轉</button>
</router-link>
//跳轉地址 ====> /home ??? (暫時沒用過)
//取值 ====> this.$route.params.key
2、$router方式跳轉:
this.$router.path({ path: '/detail', query: { name: 'admin', code: 10021 } }); //跳轉地址 ====> /detail?name=admin&code=10021 //取值 ====> this.$route.query.name
this.$router.path({
name: 'detail',
params: {
code: 10021
}
});
//跳轉地址 ====> /detail/10021
//取值 ====> this.$route.params.code