vue實現在用戶關閉或刷新瀏覽器當前網頁時彈出提示“系統可能不會保存您所做的更改”

1、首先先看一下效果圖：

2、實現步驟

（1）在項目中打開想要出現如上效果的組件的vue文件

（2）在script標籤中寫如下代碼，但是記得要替換成自己的路由

<script>
export default {
    mounted () {
        let that = this
        window.onbeforeunload = function (e) {
            if(that.$route.fullPath =="/rich"){  // 注意這裏要替換成自己的當前頁面的路由
                e = e || window.event;
                // 兼容IE8和Firefox 4之前的版本
                if (e) {
                    e.returnValue = '關閉提示';
                }
                // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
                return '關閉提示';
            } else {
                window.onbeforeunload = null
            }
        };
    }
}
</script>

（3）保存好代碼後刷新一下頁面，即可看到效果。