I have a basic ReactJS app with 5 pages in what I think is an SPA (every page shares a common header element with the menu), each page has it's own route and I'm making the menu items like this:
<Link to="/save">Save</Link>
To make the question really simple, let's say on one page the user enters his name into a text box. Then the user clicks on another page and then clicks back onto the first page. Well, when we get back to the first page, the text box is empty. What is the most common way to solve this problem with ReactJS? I want to not have had the text box get emptied. In actuality I will have quite a few things I don't want to disappear when switching between views and I'd rather not have to write code to recreate the state of everything, but just have it still be there.
This is of course a very basic question. Even just giving me a good google search string to point me in the right direction would be helpful.
The problem you describe is similar to keep-alive
in vue.js
.
you can use redux to save page data when componentWillUnmount
,and get page date when componentDidMount
.
or you can try this React Keep Alive