vue3 路由禁止返回登录或者支付页面等操作

Question

遇到得问题

用户支付成功后点击手机返回，跳转至未支付页面

我想要达到的结果

vue3路由 点击手机返回 不跳转至指定页面
如支付成功以后，除了下单成功或者重新支付外，禁止点击返回键再次跳转至支付页面

Answer 1

你可以在想要控制返回键返回的那个页面,重写浏览器返回键的处理函数,代码如下

mounted() {
          //重写浏览器返回键事件
            if (window.history && window.history.pushState) {
                window.history.pushState(null, null, document.URL);
                window.addEventListener('popstate', this.onBrowserBack, false);    //false阻止默认事件    this.fun是指返回按建实际要执行的方法
            }
        }
        onBrowserBack(){
            //在这个函数里面处理浏览器的返回事件,即用户点击返回键,就会触发这个函数,你可以在这里面做判断,什么情况需要返回支持页面,什么情况不能返回支付页面,而是直接跳转到其他页面都是可控的
        }

有什么问题欢迎留言,如果我的回答对你有帮助,希望采纳一下