Résolvez le problème que la page ne s'affiche pas lorsque Vue modifie le tableau via le tableau suivant

Maintenant, je vais partager avec vous un article pour résoudre le problème de Vue modifiant le tableau via le tableau suivant et la page ne s'affiche pas. Il a une très bonne valeur de référence et j'espère qu'il sera utile à tout le monde.

Il convient de noter que la raison pour laquelle Vue est capable de surveiller les changements dans l'état du modèle est que le langage JavaScript lui-même fournit un mécanisme Proxy ou Object.observe() pour surveiller les changements dans l'é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 le mettre à jour :

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

Ou de le supprimer via la méthode splice() Après un certain é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'épissure, le push, le unshift et d'autres appels de méthode du tableau, de sorte que le le code ci-dessus peut mettre à jour correctement la vue.

J'ai compilé ce qui précède pour vous, j'espère que cela vous sera utile à l'avenir.

Articles connexes :

Comment utiliser use pour enregistrer les composants globaux et les directives globales de Vue

Une brève discussion sur l'importation de vue.js Méthode de la bibliothèque css ( elementUi)

Utiliser le code JS pour créer du code QR et générer des fonctions (tutoriel détaillé)

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!