Javascript Girl
  1. Javascript Girl
  3. Vue.JS – comment utiliser localstorage avec Vue.JS
Intereting Posts
Rails 3 Ajax Recherche Restaurer la position du curseur après avoir changé contenteditable Exécuter un script python sur le clic de bouton La même politique d'origine, google chrome, toile et fichier: // scheme Qu'est-ce qui doit changer dans ce fichier package.json pour fonctionner avec npm 0.3.0? Javascript pour faire passer la page à un emplacement spécifique Pendant le défilement: si scrollTop () est égal ou atteint un événement d'exécution de valeur Comment modifier chaque jSON object javascript Comment créer un navigateur? Javascript concatant les nombres, n'ajoute pas Afficher un div uniquement sur la page d'accueil du blog tumblr? Ne peut-il pas simplement utiliser ES6 promettre de mettre à jour les données dans ng-repeat? Quelles sont les méthodes de protection des applications / jeux web JavaScript? Comment détecter window.print () finir L'expression de la fonction appelée immédiatement lance "l'objet n'est pas une fonction"

Vue.JS – comment utiliser localstorage avec Vue.JS

Je travaille sur l'éditeur de Markdown avec Vue.JS et j'ai essayé d'utiliser localstorage pour économiser des données mais je ne sais pas comment enregistrer de nouvelles valeurs dans les variables de données dans Vue.JS chaque fois que l'utilisateur tape!

Notez que ceci était une modification dans ma question, mais je le fais répondre séparément comme l'a suggéré @nathanvda.

J'ai trouvé la solution que je cherchais. Première méthode de surveillance d'utilisation pour détecter les changements sur la variable que vous stockez des données comme ceci: 

watch: { input: function () { if (isLocalStorage() /* function to detect if localstorage is supported*/) { localStorage.setItem('storedData', this.input) } } }

Cela mettra à jour la valeur de la variable chaque fois que l'utilisateur ajoutera de nouvelles entrées.

Ensuite, affectez la nouvelle valeur à une variable comme celle-ci: 

 app.input = localStorage.getItem('storedData');

Et c'est tout 🙂

Vous pouvez faire tout ce qui suit pour économiser dans localStorage 

 localStorage.setItem('YourItem', response.data)

Vous pouvez l'utiliser en utilisant: 

 localStorage.getItem('YourItem')

Pour supprimer ceci de localStorage : 

 localStorage.removeItem('YourItem')