信息发布→ 登录 注册 退出

vue路由跳转router-link清除历史记录的三种方式(总结)

发布时间:2026-01-11

点击量:
目录
  • 路由跳转router-link清除历史记录
    • 官方文档提供了如下三种方式
  • vue跳转后不记录历史记录

    路由跳转router-link清除历史记录

    1.在vue项目中说起路由跳转,我们最先想到的就是router-link标签以及this.$router.push函数。

    router-link和this.\$router.push的实现原理是一样的,在点击router-link时,内部调用的就是this.$router.push。

    2.this.\$router.push这个方法会向 history 栈添加一个新的记录,所以,当用户点击浏览器后退按钮时,则回到之前的 URL。

    那在我们使用路由跳转的时候如何去掉历史记录呢?

    官方文档提供了如下三种方式

    1.使用router-link标签时去掉历史记录:加上replace属性

    <router-link to='/project_selection' replace class='btn_none' tag="a">项目列表</router-link>

    2.使用this.\$router.push标签时去掉历史记录:加上replace属性,默认值为false

    this.$router.push({path: '/project_selection',replace:true})

    3.使用this.\$router.replace标签时去掉历史记录

    this.$router.replace({path: '/project_selection'})

    所有内容源自于官网:vue路由核心插件

    vue跳转后不记录历史记录

    vue路由跳转一般情况下是使用push,

     this.$router.push({
                    path: "/testTeam/testTeam",
                  });

    若是特殊需求,页面跳转后不记录到历史记录中,将push改为replace即可

    this.$router.replace({path: '/project_selection'})

    以上为个人经验,希望能给大家一个参考,也希望大家多多支持。

    在线客服
    服务热线

    服务热线

    4008888355

    微信咨询
    二维码
    返回顶部
    ×二维码

    截屏,微信识别二维码

    打开微信

    微信号已复制,请打开微信添加咨询详情!