监听浏览器点击后退按钮

跳转前

// 监听浏览器点击后退按钮.js
mounted(){
    if (window.history && window.history.pushState) {
        // console.log('建立监听------------1');
        history.pushState(null, null, document.URL);
        window.addEventListener('popstate', this.goBack, false);
    }
},
destroyed(){
    // console.log('取消监听------------1');
    window.removeEventListener('popstate', this.goBack, false);
},
methods: {
    goBack(){
        // console.log('监听事件');
        this.$router.replace({path: '/login'});
        //replace替换原路由，作用是避免回退死循环
    },
}

跳转后

// 禁止浏览器点击后退按钮
mounted () {
    var query = {};
    var route = this.$route.query;
    if (route.ticket) {
        query.ticket = route.ticket;
    } else if (route.chUser) {
        query.chUser = route.chUser;
    } else if (route.chRole) {
        query.chRole = route.chRole;
    }
    this.$router.replace({ path: '/focus' , query});
 
 
    if (window.history && window.history.pushState) {
        console.log('建立监听------------1');
        history.pushState(null, null, document.URL);
        window.addEventListener('popstate', this.goBack, false);
    }
},
destroyed(){
    // console.log('取消监听------------1');
    window.removeEventListener('popstate', this.goBack, false);
},
methods: {
    goBack(){
        // console.log('监听事件');
        history.pushState(null, null, document.URL);
    },
}