vue页面跳转
一、router-link跳转
跳转:
1、直接跳转
<router-link to="/detail/one">link跳转 </router-link>
2、携带参数跳转
<router-link :to="{path:'/detail/two', query:{id:1,name:'vue'}}">link跳转 </router-link>
3、打开新窗口跳转
<router-link :to="{path:'/detail/three', query:{id:1,name:'vue'}}" target="_blank">link跳转</router-link>
获取参数:
id = this.$route.query.id
二、this.$router.push跳转
1、path query 跳转:
this.$router.push({path: "/detail", query: {id: e}})
获取参数:
id = this.$route.query.id
2、name params跳转:
this.$router.push({name: "/detail", params: {id: e}})
获取参数:
id = this.$route.params.id
三、resolve页面跳转可用新页面打开
跳转:
const new = this.$router.resolve({name: '/detail', params: {id: e}})
或
const new = this.$router.resolve({path: '/detail', query: {id: e}})
window.open(new.href,'_blank')
获取参数:
id = this.$route.params.id
或
id = this.$route.query.id