Maison > interface Web > js tutoriel > le corps du texte

Comment résoudre le problème de la non-mise à jour de la vue lorsque les propriétés de l'objet sont modifiées dans Vue ?

亚连
Libérer: 2018-06-05 13:45:50
original
2792 Les gens l'ont consulté

Ci-dessous, je partagerai avec vous un article qui résout le problème de la non-mise à jour de la vue lorsque les propriétés d'un objet sont modifiées dans Vue. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde.

Normalement, nous définissons les données de réponse dans les données de l'instance vue. Mais lorsque la donnée est un objet et que l'on ajoute ou supprime la valeur de l'attribut de l'objet, la vue ne déclenche pas de mise à jour. Comment résoudre ce problème ?

L'exemple de code est le suivant :

let vm = new Vue{
 el: '#app',
 data: {
  obj: {
    k: 'v'
  }
 },
 ...
}
Copier après la connexion

Il existe trois solutions :

Option 1 : Utiliser Vue.set(object,key,val)

Exemple : Vue.set(vm.obj,' k1', 'v1')

Option 2 : Utilisez this.$set(this.obj,key,val)

Exemple : this.$ set(this.obj,'k1','v1')

Option 3 : Utiliser Object.assign({}, this.obj) pour créer un nouvel objet

Exemple :

 this.obj.k1='v1';
 this.obj = Object.assign({}, this.obj)
Copier après la connexion

ou

this.obj = Object.assign({}, this.obj,{'k1','v1'})
Copier après la connexion

Ce qui précède est ce que j'ai compilé pour tout le monde, j'espère que cela sera utile à l'avenir. Utile à tout le monde.

Articles associés :

Comment ajouter, supprimer et modifier des méthodes de requête via des tables dans AngularJs

Comment utiliser ExtJs pour intégrer Echarts (tutoriel détaillé)

Comment ajouter et supprimer dynamiquement des méthodes div dans angulaireJS

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
vue
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal