Vue路由跳转

1.通过使用<router-link></router-link>标签实现跳转


router-link实现路由跳转

如果希望跳转后,不保留上一个页面的历史记录,可以在router-lick上加入replace

例如:<router-link to="/"  replace></router-link>

2. this.$router.push() 跳转

(1)params跳转

this.$router.push({path:"/", params:{id:1}})

                          //跳转路径     //跳转参数

(2)query跳转

this.$router.push({path:"/", query:{id:1}})

                          //跳转路径     //跳转参数

3.query跳转和params跳转的区别

路由传值有两种方式,params和query,params传值刷新页面是要消失的,然而query却不会,两者的区别就在于query会把传递的参数显示在url地址中,就像这样:/adminUser/001001001?jum=001001001211,参数过多的话url地址会变得非常难看,如果你并不在意url地址难看与否,那么你可以不使用params,而是使用query,只是切换个单词而已,这是一种方法(不是最优办法)。

4.返回上一页,不存在历史记录

this.$router.replace({

path:"/123"

})

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

相关阅读更多精彩内容

  • 1、router.push(location)=====window.history.pushState 除了使用...
    王哈哈wl阅读 5,526评论 0 0
  • 现有如下场景,点击父组件的li元素跳转到子组件中,并携带参数,便于子组件获取数据。父组件中: methods:方案...
    豌豆荚_6d7e阅读 1,639评论 0 0
  • 参考:解决vue路由跳转未匹配路径时出现空白页的问题在进行vue项目开发时,常用vue-router进行路由的导航...
    轻丨尘阅读 9,999评论 0 1
  • 本文转载于前端工匠。如有侵权联系本人立刻删除 一、首先带着问题 要学习vue-ro...
    qiaoguoxing阅读 3,369评论 0 1
  • 我独爱夜色 爱寂寞的群星闪烁 不食五谷杂粮 不见人间烟火 然后,世界只剩我一人 看,白天叽喳的鸟儿在沉睡 离开茎的...
    皇氏三墳阅读 2,839评论 0 3

友情链接更多精彩内容