How to cache fetched data in react without redux

0 votes

Using Redux I have common store and when I change my location, for example I went from /videos page, but I still have fetched videos in my videos reducer. So if I then decide to go back to my videos page I show user already loaded videos from my store, and will load more if he needs and store them.

But in React without Redux if I change my location /videos where I fetched some videos and then stored them in my local state of my VideosPage component and then went back to this page, I have no videos anymore and should fetch them from scratch.

How can I cache them and is it possible?

Jun 1, 2020 in PHP by kartik
• 37,510 points
970 views

1 answer to this question.

0 votes

Hello @kartik,

The best way to save data when you want to repopulate it at a later point of time is to save it in localStorage, which allows you to get the data even after refreshing the app

const InitialState = {
   someState: 'a'
}
class App extends Component {

 constructor(props) {
  super(props);

  // Retrieve the last state
  this.state = localStorage.getItem("appState") ? JSON.parse(localStorage.getItem("appState")) : InitialState;

}

componentWillUnmount() {
  // Remember state for the next mount
  localStorage.setItem('appState', JSON.stringify(this.state));
}

render() {
  ...
 }
}

export default App;

Hope it works!!

To know more about React, We highly recommend to join React Certification Course today.

Thank You!!

answered Jun 1, 2020 by Niroj
• 82,880 points

Related Questions In PHP

0 votes
1 answer

How to post data in PHP using file_get_contents?

Hello @kartik, Sending an HTTP POST request using file_get_contents is ...READ MORE

answered Aug 24, 2020 in PHP by Niroj
• 82,880 points
6,512 views
0 votes
1 answer

How to write CSV To File Without Enclosures In PHP?

Hello @kartik, The warnings about foregoing enclosures are ...READ MORE

answered Nov 9, 2020 in PHP by Niroj
• 82,880 points
3,735 views
0 votes
0 answers

How to reverse an array in php WITHOUT using the array reverse method

I have an array called reverse array ...READ MORE

Jun 12, 2022 in PHP by narikkadan
• 63,420 points
1,791 views
0 votes
1 answer

How to Validate Form Data With PHP?

Hey @kartik, The first thing we will do ...READ MORE

answered Feb 13, 2020 in PHP by Niroj
• 82,880 points
2,883 views
+1 vote
1 answer

How to make anchor tag with routing using Laravel?

Hey @kartik, First you have to go to ...READ MORE

answered Mar 18, 2020 in Laravel by Niroj
• 82,880 points
21,750 views
0 votes
1 answer

What is redirection in Laravel?

Named route is used to give specific ...READ MORE

answered Mar 18, 2020 in Laravel by Niroj
• 82,880 points
2,647 views
0 votes
1 answer

How to install Laravel via composer?

Hello, This is simple you just need to ...READ MORE

answered Mar 23, 2020 in Laravel by Niroj
• 82,880 points
2,505 views
+1 vote
1 answer

What are named routes in Laravel and How can specify route names for controller actions?

Hey @kartik, Named routing is another amazing feature of ...READ MORE

answered Mar 23, 2020 in Laravel by Niroj
• 82,880 points
41,372 views
0 votes
1 answer

How to get Redux Form data in another Component?

Hello @kartik, What you need to do is ...READ MORE

answered Jun 1, 2020 in PHP by Niroj
• 82,880 points
3,860 views
0 votes
1 answer

How to export the MySql database structure without the data just the structure?

Hello @kartik, You can do with the --no-data option with ...READ MORE

answered Aug 18, 2020 in PHP by Niroj
• 82,880 points
2,209 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP