Wie warne ich einen Benutzer von nicht gespeicherten Änderungen vor dem Verlassen einer Seite in Vue

Question

Ich habe eine UnsavedChangesModal als eine Komponente, die gestartet werden muss, wenn der Benutzer versucht, die Seite zu verlassen, wenn er nicht gespeicherte Änderungen in den Eingabefeldern (ich habe drei Eingabefelder auf der Seite).

components: { 
    UnsavedChangesModal 
}, 
mounted() { 
    window.onbeforeunload = ''; 
}, 
methods: { 
    alertChanges() { 

    } 
} 

Answer 1

Verwenden Sie Vue-Router? Ich würde in die Navigationswachen schauen. Ich behalte sie im Kopf, habe sie aber selbst noch nicht benutzt. Hier ist die Dokumentation zu ihnen: https://router.vuejs.org/en/advanced/navigation-guards.html