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

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容