Stoppen Sie die Zerstörung der vue.js-Komponente, weil es nicht gespeicherte Änderungen gibt

Question

Ich verwende . Ich habe eine Komponente, wo der Benutzer Daten speichern kann. Es ist jedoch möglich, dass der Benutzer die Daten nicht gespeichert hat und er versucht, zu einer anderen Route zu navigieren oder die Komponente zu zerstören. Ich möchte eine Nachricht anzeigen, dass nicht gespeicherte Daten vorhanden sind und der Benutzer sie wirklich ungespeichert lassen möchte.

Wenn der Benutzer sagt, dass er die ungesicherten Daten nicht verlassen will, muss ich die Navigation oder die Zerstörung der Komponente stoppen. Ich verwende beforeDestroy, um zu überprüfen, ob nicht gespeicherte Daten vorhanden sind, und es funktioniert, aber ich kann nicht aufhören, die Komponente oder die Navigation zu zerstören. Ich habe versucht mit beforeRouteLeave, aber es funktioniert nicht. Irgendwelche Ideen, wie das funktioniert?

Answer 1

Hmm ich sehe, sind Sie sicher mit beforeRouteLeave auf diese Weise

beforeRouteLeave (to, from , next) { 
    const answer = window.confirm('Do you really want to leave? you have unsaved changes!') 
    if (answer) { 
    next() 
    } else { 
    next(false) 
    } 
} 

Schlüssel ist nächste (false)

Sie müssen es in next()false als Argument übergeben, so wird nicht zur nächsten Route weitergeleitet.

müssen nur überprüfen, ob es richtig verwendet wird.