Explication détaillée de l'utilisation des mutations et des actions dans Vuex

Cette fois, je vais vous apporter une explication détaillée de l'utilisation des mutations et des actions dans Vuex Quelles sont les notes d'utilisation. mutations et actions, comme suit C'est un cas pratique, regardons-le.

La distinction entre les actions et les mutations n'est pas de résoudre les conditions de concurrence, mais de pouvoir utiliser des outils de développement pour suivre les changements d'état. En fait, dans vuex, les actions ne sont qu'un concept d'

architecture

, qui n'est pas nécessaire en dernière analyse, c'est juste une fonction Vous pouvez y faire ce que vous voulez, tant que la mutation est finalement déclenchée. La manière de gérer les conditions de concurrence asynchrone relève de l'affaire de l'utilisateur. La seule vraie limitation de vuex est que la mutation doit être synchrone (en redux c'est comme un réducteur Doit revenir à l'état suivant de manière synchrone). La signification de la synchronisation est qu'après l'exécution de chaque mutation, elle peut correspondre à un nouvel état (identique au réducteur), donc les outils de développement peuvent prendre un instantané et le sauvegarder, puis vous pouvez

voyager dans le temps

à volonté. Si vous avez activé l'outil de développement et appelez un outil asynchrone action, vous pouvez voir clairement quand les mutations qu'il appelle sont enregistrées, et vous pouvez immédiatement visualiser leur statut correspondant.

Test personnel : Si une opération asynchrone est effectuée en mutation, un instantané sera imprimé immédiatement dans dev-tools, et l'opération asynchrone n'est pas encore terminée à ce moment-là. instantané Les informations sont fausses. Lors de l'exécution d'opérations asynchrones dans une action, les outils de développement attendront que l'opération asynchrone soit terminée avant d'imprimer un instantané de la mutation. Cela nous permet de vérifier plus facilement le voyage dans le temps et les changements dans une certaine mutation.

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 php !

Lecture recommandée :

Comment implémenter Yuansheng JS fonction todolist

FileReader implémente un aperçu local avant de télécharger des images

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!