VUE は Web ページの終了と非表示をリッスンします

1. Web ページの終了を監視し、終了操作を実行します。

1.mounted()でページシャットダウンのモニターを作成します。

window.addEventListener("beforeunload", (e) => this.beforeunloadHandler(e));
window.addEventListener("unload", (e) => this.unloadHandler(e));

 2. 監視はページが閉じる前に行われ、対応するメソッドは次のように記述できます。

// 页面关闭之前，触发提示框
    beforeunloadHandler(e) {
      if (e) {
        e = e || window.event;
        console.log(e);
        if (e) {
          e.returnValue = "关闭提示";
        }
        return "关闭提示";
      }
    },

3. リスナーはページが閉じられたときに、独自の非同期処理を呼び出すことができます。

  async myfuncation(e) {
      // 
      await &&**********
  },

4. Destroyed ()、ログアウトリスナー

destroyed() {
    window.removeEventListener("beforeunload", (e) =>
      this.beforeunloadHandler(e)
    );
    window.removeEventListener("unload", (e) => this.unloadHandler(e));
  },

 2. VUE は Web ページの非表示表示をリッスンします。

mounted(){
    //添加监听事件
    window.addEventListener('beforeunload', e => this.beforeunloadHandler(e));

    document.addEventListener('visibilitychange',function(e){
      console.log(document.visibilityState);
      let state = document.visibilityState
      if(state == 'hidden'){
        console.log(document.visibilityState,'用户离开了');
      }
      if(state == 'visible'){
        console.log(document.visibilityState,'回来了');
      }
    });

  }