Comment gérer le non rendu de la page lorsque Vue utilise le tableau suivant pour modifier le tableau

Cette fois, je vais vous montrer comment gérer le non-rendu de la page lorsque Vue utilise le tableau suivant pour modifier le tableau. Quelles sont les précautions pour résoudre le problème du non-rendu de la page lorsque Vue l'utilise. le tableau suivant pour modifier le tableau. Ce qui suit est un cas pratique.

Il convient de noter que la raison pour laquelle Vue est capable de surveiller les changements dans le modèleétat est parce que le langage JavaScript lui-même fournit un proxy ou un objet. Le mécanisme observe() est utilisé pour surveiller les changements d'état de l'objet . Cependant, il n'existe aucun moyen de surveiller directement l'affectation des éléments du tableau. Par conséquent, si nous attribuons directement des valeurs aux éléments du tableau :

vm.todos[0] = {
  name: 'New name',
  description: 'New description'
};

empêchera Vue de mettre à jour la vue.

La bonne façon n'est pas d'attribuer une valeur à l'élément du tableau, mais de mettre à jour :

vm.todos[0].name = 'New name';
vm.todos[0].description = 'New description';

Ou, via l'épissure (), Après avoir supprimé un élément, ajoutez un autre élément pour obtenir l'effet d'« affectation » :

var index = 0;
var newElement = {...};
vm.todos.splice(index, 1, newElement);

Vue peut surveiller l'épissage, le push, le décalage et d'autres appels de méthode du tableau, afin que la vue de code ci-dessus puisse être mise à jour correctement.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser xe-utils dans vue

vue-router n'affiche pas les itinéraires lors de la construction Comment gérer la page

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!