CODEWITHSUNDEEP
vuejs2vue-router
Hkm Sadek
Hkm Sadek

Reputation: 3209

How to stop reloading the components in vue router?

I tried to find some article on it but couldn't find any.

I am using vue router and loading data via axios in created hook. The problem is, I don't want to call the created hook every time user visits to next route and come back. So when user click back, currently the created hook runs which reloads the data from database. What I want is to block re rendering of data and use already loaded previous components.

Thank you.

Upvotes: 0

Views: 1584

Answers (1)

rupesh_padhye
rupesh_padhye

Reputation: 1405

You can create variable e.g. initialState to maintain the data and if that is empty query the database otherwise take from the variable.

const initialState = {
  counter: 0,
};
export default {
  name: 'ComponentName',
  created() {
    initalState.counter += 1;
    console.log(initalState.counter);
  }
}

If you refresh the browser then variable will be reset to origin in that case you can use localstorage

Upvotes: 1

Related Questions