Prevent navigation if page has unsaved changes

[FeldrinH]

Is there a way to prevent navigating away from a page under certain condition, such as when the page contains a form with unsaved changes?
(Something like beforeNavigate in SvelteKit)

[flipkickmedia]

Set a flag in context which indicates there are changes isDirty, then do something like this:

let ctx = getContext("unsavedChanges");

window.onload = function() {
    window.addEventListener("beforeunload", function (e) {
        if (!ictx.isDirty) {
            return undefined;
        }

< do js to show the message >

    });
};

We could store this state inside the route config but you'd need to pass that into the config.

This repo is no longer being maintained, so head over to https://github.com/flipkickmedia/svelte-router-spa if you still want this.