vue2 浏览器左上角回退提示确认信息

        根据项目需求，有的页面返回时需要对页面进行二次确认功能，如果页面含有面包屑的，可通过面包屑回退，这是可以通过vue-router的路由守卫进行处理，但是如果点击浏览器的左上角的返回的话，此方法就不好用了，下面方式是针对浏览器左上角回退时出现提示的处理

mounted() {
    // 添加此行代码为了在二次确认弹出时点击取消时页面不改变处理
    window.history.pushState(null, null, window.location.href);
    // 监听浏览器回退
    window.addEventListener('popstate', this.handleWindowClose);
}


mehtods: {
    handleWindowClose(evvent){
        if (confirm('编辑的内容可能未保存，确认离开?')) {
            window.removeEventListener('popstate', this.handleWindowClose);
            // TODO: 确认回退时的操作
        } else {
            // 取消回退
            window.history.pushState(null, null, window.location.href);
        }
    }
}

beforeDestroy() {
    // 一定要在组件销毁前移除事件监听，防止内存泄露
    window.removeEventListener('beforeunload', this.handleWindowClose);
}

        如果，页面也包含面包屑的话，点击面包屑返回也需要确认提示，那这时候使用路由守卫会有冲突，可以直接给面包屑添加点击方法进行跳转