我正在開發(fā)一個通用應用程序，讓用戶輸入公式并保存，yadda yadda。我想確保在未保存更改時警告用戶，通過應用內(nèi)路由和 beforeunload 事件觸發(fā)的提示。兩者都應該在發(fā)生更改時處于活動狀態(tài)，但如果沒有任何更改/表單為空，則恢復為非活動狀態(tài)。第一個完美無缺。第二個，“beforeunload”事件也被讀取和刪除，但前提是觸發(fā)更改為“isEmpty / isDifferent”狀態(tài)的輸入元素首先未獲得焦點。這很煩人，因為當用戶開始輸入時它不會提供即時反饋，因為即使該字段不為空，用戶也可以通過刷新使頁面不被警告，因為他沒有使輸入失去焦點。以下是相關代碼：handleBeforeUnload (e) {      console.log('leaving')      e.preventDefault()    },    leaving (preventDefault) {      if (preventDefault) {        window.addEventListener('beforeunload', this.handleBeforeUnload)        console.log('should be added')      } else {        window.removeEventListener('beforeunload', this.handleBeforeUnload)        console.log('should be removed')      }    }  },  components: {    'form-input': Input,    modal: Modal  },  watch: {    isEmpty () {      this.leaving(!this.isEmpty)    }  },現(xiàn)在我只配置了組件來處理新文檔，這就是為什么我現(xiàn)在只使用“isEmpty”作為狀態(tài)。在“handleBeforeUnload”方法之前，該鏈按預期工作，該方法只能在用戶在輸入未聚焦后刷新或類似情況下觸發(fā)。我推測這種行為可能是 Vue 的生命周期鉤子的結(jié)果，特別是“beforeDestroy”，但我不確定。是什么導致了這種行為？提前致謝。