How to handle on browser back button click event in Vuejs

Question

In Vue component, I want to handle on browser back event like this:

mounted() { if ([browser back]) { console.log("browser back button clicked") } else { console.log("stay here") } }

To handle browser back event, I found window.onpopstate function but I don't know how to put it inside the if statement.

Can you tell me what should I do on this case? Thank you!

Martin · Accepted Answer · 2022-05-13 07:52:07Z

5

You don't need to put inside an if statement. The event handler is sort of an "if statement".

See this example:

mounted() { // if back button is pressed window.onpopstate = function(event) { alert("location: " + document.location + ", state: " + JSON.stringify(event.state)); }; }

edited May 13, 2022 at 7:52

Martin

134 bronze badges

answered Nov 20, 2019 at 9:06

Kalimah

11.5k11 gold badges48 silver badges86 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

The Blues Over a year ago

But in not browser back case, how can i handle this?

Kalimah Over a year ago

When in normal mode (before back pressed) you can add any code to mounted then override it in onpopstate. Are you checking for hash changes in url?

Collectives™ on Stack Overflow

How to handle on browser back button click event in Vuejs

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related