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

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

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

history.pushState(null, null, document.URL);
      window.addEventListener('popstate', function () {
      history.pushState(null, null, document.URL);
});
我想要达到的结果

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

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

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

这个可能控制不了 浏览器的前进后退这个东西主要是屏蔽不了

beforeRouteleave 为啥没作用呢

你可以做页面监听
https://blog.csdn.net/weixin_44326389/article/details/121742402

把url写死:


window.addEventListener('popstate', function () {
      history.pushState(null, null, ‘修改密码页面URL’);
})