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

解决:(此为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);
    }
}

 

Logo

前往低代码交流专区

更多推荐