Vue如何清空所有路由？

Question

如何把vue的路由全部清空，就是不可以返回

比如页面A->页面B->页面C，在页面C的时候就把前面AB两个页面的路由清空掉。也就是按返回键不会跳回之前的页面。

百度查了一下，在链接上加入一个属性不被记录到路由，这个不是我想要的效果。

所以有没有直接把路由清空的方法？求大神指教

Answer 1

本来1L 已经说的很清楚了，但是楼主好像还有一些疑惑，我来试着解答下

我用的是router-link标签跳转的。页面那么多内容，我不可能用js控制跳转路由吧。router-link加上replace这个属性也不会被记录到路由，这个replace不是我要的效果。没一级跳转都要加这个，很麻烦。而且有的页面是需要返回的。我要的是在不需要记录的页面把记录的路由清空掉。replace不会把记录的路由删掉。

因为路由的默认行为就是 push, 至于你说的每一级都加的问题是因为你的业务和默认行为不符，那你怎么解决呢？

第一种方法：封装一个 <router-link :to="..." replace>，将默认行为变成 replace 例如

    // myRouterLink.vue
    <router-link v-bind="$attrs" replace>

    // 页面.vue
    <template>
      <my-router-link to="xxx" />
    </template>

第二种方法：在拦截器里面根绝业务逻辑做跳转

至于你说你有些页面不需要 replace, 那你以为 vue-router 是神仙吗？你不告诉 vue-router 要 replace 还是 push, vue-router 怎么知道你要干嘛

Answer 2

你在跳转的时候不要用push跳转，使用replace跳转，push会记录页面的记录，replace不会

Answer 3

路由配置时增加元信息，然后在路由钩子中判断是不是具有这个元信息，然后删除对应的记录