[Vuejs]-Cleanest way to work with localStorage in VUE

by

0👍

✅

EDIT: alright, here I am with a new code example. In this one, you can see a playlist implementation that may be useful to you. You will able to see a playlist logic:

  • add a first user
  • append a new user
  • delete the whole playlist

Here it is: https://codesandbox.io/s/save-entity-to-localstorage-with-array-appending-r5b6z?file=/pages/index.vue

You basically just need to handle the duplicates and see when you load it in your project !

So, as told in the comments in your question, you cannot and should not store HTML directly into the localStorage.
You may store the object itself, and then use some logic if you wish to fill your template with the localStorage.

Here is a demo on how to:

  • call an API and wait for it with async/await syntax
  • loop on those results
  • save a specific user to the localStorage

You may store several users rather than one, I don’t know. But this is the starting point you should work on.

Here you can see on the screenshot, that it’s saved properly into the localStorage enter image description here

Leave a comment