React router v6, Remove History

user_8311792 0
Viewed 735

Is there a way to remove history in react-router v6, I'm creating a web app, when the user reaches to homepage and presses back it should eventually exit the app. but as of now, it's going back if history exists. if react-router doesn't have this feature is there an alternative way to overcome this issue?

react-router-dom react-router react-hooks reactjs
2 Answers

I have just done a PWA app like you and the way I solved this is that I always set option {replace: true} whenever it went forward or backward.

Ex: navigate(/${SCREEN_1}, { replace: true }) or navigate(-1, { replace: true })

So when user click on button "Next"/"Back" on the browser, there were only the first blank page of the browser (where before I open my URL) and the current page.

My app only have 6 screens. I'm not sure whether this way will be useful for you or not, but for me it did. Hope this help!

user_122526010

I didn't understood your question excatly. But below code maybe helpful to go back to previous page.

import {useNavigate} from 'react-router-dom'

const Component = () => {
   const navigate = useNavigate()
   const goBack = () => {
      navigate(-1)
}

return (
   <>
      <button onClick={goBack}>Back</button>
   </>
)
}
user_154842120
Related