移动端 -- 禁止微信浏览器物理返回键

需求:当完成一系列步骤之后,提交完成后,不想通过手机上的返回键返回到上一个页面,需要跳转到指定页面,这时候就需要禁止掉物理返回键

解决:(此为Vue中的写法)

export default {
    name: 'complete',
    methods: {
        routeTo () {
            this.$router.replace({name: '指定跳转的路由name'}); // 防止路由中存在上级缓存
        },
        forbidBack () {
            window.history.pushState('forward', null, '#');
            window.history.forward(1);
        }
    },
    mounted () {
        // 监听手机物理返回键时禁止返回之前的路由
        if (window.history && window.history.pushState) {
            window.addEventListener('popstate', this.forbidBack, false);
            this.forbidBack() 
        }
    },
    destoryed () {
        // 离开页面时销毁监听
        window.removeEventListener('popstate', this.forbidBack, false);
    }
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值