Giter Club home page Giter Club logo

Comments (2)

AditiG12 avatar AditiG12 commented on July 17, 2024

IS there any update ?

from page.js.

AshfordN avatar AshfordN commented on July 17, 2024

What you are trying to do is not as simple as it seems. The browser's back button is a browser-level control, and, to the best of my knowledge, no major browser allows you to cancel or intercept the effects of the back button.
I have a similar requirement (although with a slightly wider scope) for a SPA that I'm working on, and it takes quite a bit of programming gymnastics to get it right — almost to the point of spaghetti code — since you're wrestling against the aforementioned limitations of the browser.
If you're only concerned about the back button, you could probably try replacing the current history state, then pushing a new one. That way, when the user moves backwards in the history, you'd be in a position to test for the first state. Something like this:

// --snip--
// the user changed the form
let state = history.state;
state.marked = true;
history.replaceState(state);

// --snip--
// define newState
history.pushState(newState, null);

// --snip--
// user presses the back button

// --snip--
// we are now in the middleware/route handler
if (history.state.marked) {
    let r = confirm("You pressed a Back button! Are you sure?!");
    if (r) {
        let state = history.state;
        delete state.marked;
        history.replaceState(state);
        history.back();
    } else {
        history.forward();
    }
}

Now, of course, the code above is just a very rough estimation of the algorithm. You'd have to do your own research and figure out how best to adapt this approach to your project. But, all in all, I don't think the issue that you've described is inherently related to page.js.

from page.js.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.