vue 路由跳转前确认框，刷新浏览器页面前提示确认框

先看效果图：

1.刷新页面效果：

 

2.跳转路由（进入别的页面前）效果：

 

 

 

代码：

   // 路由跳转确认
  beforeRouteLeave(to, from, next) {
    const answer = window.confirm("当前页面数据未保存，确定要离开？");
    if (answer) {
      next();
    } else {
      next(false);
    }
  },
  // 浏览器刷新确认 把下面 '/test' 换成需要确认操作效果的页面路径，可以通过注释window.onbeforeunload函数后在控制台查看console
  mounted() {
    var _this=this;
    console.log(_this.$route.fullPath)
    window.onbeforeunload = function(e) {
      if (_this.$route.fullPath == '/test') {
        e = e || window.event;
        // 兼容IE8和Firefox 4之前的版本
        if (e) {
          e.returnValue = "关闭提示";
        }
        // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
        return "关闭提示";
      } else {
        window.onbeforeunload = null;
      }
    };
  }