Element UI导航菜单之秘：无痕迹浏览与历史记录栈的管理

最新推荐文章于 2024-05-22 18:11:34 发布

原创

最新推荐文章于 2024-05-22 18:11:34 发布 · 1.6k 阅读

22 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #前端框架 #vue #vue.js #elementui #javascript #chrome

文章介绍了如何在ElementUI的el-menu中实现无痕迹流量模式，通过使用`router.replace`而非`router.push`来避免历史记录缓存，保持用户浏览的私密性。

前言

需求

在使用 Element UI 的 el-menu 导航栏菜单时，发现 history 栈（历史记录栈）会不断缓存之前的记录，而在某些场景下我们可能不希望 history 栈（历史记录栈）中有之前的记录，即实现无痕迹流量模式。

示例

以下实例为默认行为对应情形：

代码

    <el-menu 
        :default-active="activeIndex" 
        mode="horizontal" 
        @select="handleSelect" 
        router
    >
      <el-menu-item index="/about">about</el-menu-item>
      <el-menu-item index="/mode">mode</el-menu-item>
      <el-menu-item index="/pagination">pagination</el-menu-item>
    </el-me