vue 单个路由页面组织浏览器后退按钮

Question

问题遇到的现象和发生背景

登录后进入修改密码页面，要求不能退回登录页面，我使用beforeRouteleave 并没有作用，使用下面这段代码也没有效果，求指教！

history.pushState(null, null, document.URL);
      window.addEventListener('popstate', function () {
      history.pushState(null, null, document.URL);
});

我想要达到的结果

修改密码页面不能后退，成功修改后才能进行页面跳转

Answer 1

题主用vue的话，是否有搭建路由呢？可以直接使用路由的方法来实现呀

1. 首先第一个需求：修改密码页面不能后退。直接用路由的 this.$router.replace(xxx) 方法即可，相当于直接替换登录界面，就无法后退到登录界面了（具体参数用法可自行百度看下）
2. 第二个需求：修改成功才能进行页面跳转。修改成功后，如果不想可以后退到修改密码的界面，也是用 this.$router.replace(xxx)；如果还想让修改密码的界面存在页面栈中，则使用 this.$router.push(xxx)