在使用keep-alive和阻止浏览器后退的时候遇到的问题。

Question

在使用keep-alive和阻止浏览器后退的时候遇到了问题。

<keep-alive>
        <router-view :key="$route.path"  />
</keep-alive>

我在每一步都使用了阻止浏览器后退。

mounted() {
    // 阻止浏览器后退行为
    history.pushState(null, null, document.URL);
    window.addEventListener("popstate", () => {
      history.pushState(null, null, document.URL);
    });
  },

首先我在第一步，正常（点击后退没效果）。

然后点击按钮“下一步”，来到第二步，正常（点击后退没效果）。

this.$router.push('2')

接着，我点击按钮“上一步”，来到第一步，不正常（点击后退，就到了第二步了）

this.$router.push('1')

遇到的问题是：只有点了“上一步”按钮，然后点后退，就会生效，我试了销毁监听事件也没用

Answer 1

题主参考下

vue禁用浏览器回退_洲霸霸的博客-CSDN博客_vue 禁用回退 mounted() { history.pushState(null, null, document.URL) window.addEventListener('popstate', () => { history.pushState(null, null, document.URL) }) }, destroyed(){ window.removeEventListener("popstate",() => {. https://blog.csdn.net/weixin_46709512/article/details/123838962