vue怎么直接跳转到其他页面_vue的页面跳转方式和传值、取值

写业务中，从一个页面跳转到另一个页面，经常需要传值和取值，如何实现？

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方式跳转

通过query

this.$router.push({

　　path: '/detail',

　　query: {

　　　　name: 'admin',

　　　　code: 10021

　　}

});

跳转地址 ====> /detail?name=admin&code=10021

取值 ====> this.$route.query.name

通过params

this.$router.push({

　　name: 'detail',

　　params: {

　　　　code: 10021

　　}

});

跳转地址 ====> /detail（注意：地址不会有参数，所以页面刷新传递的数据就没了）

取值 ====> this.$route.params.code