[Vuejs]-LocalStorage persisting with looped Vue component

0👍

This looks exactly like race condition. There are multiple component instances that compete over the storage, and it becomes overwritten eventually.

This makes an early copy that won’t contain updates from other instances:

this.localStorage = JSON.parse(localStorage.storageData)

this.localStorage should be assigned immediately before updating the storage, or there should be a common state for all component instances (e.g. by using Vuex with persistence).

0👍

You have an error in your created function, right?

If you want to get "storageData" from local storage it should be:


created: function () {
this.localStorage = JSON.parse(localStorage.getItem('storageData'));
console.log(this.localStorage);
},

Leave a comment