Maison >interface Web >Voir.js >Quelles sont les étapes du cycle de vie de vue ?

Quelles sont les étapes du cycle de vie de vue ?

WBOY
WBOYoriginal
2022-03-17 11:43:394017parcourir

Le cycle de déclaration de Vue comporte huit étapes, qui sont : 1. Avant la création de l'instance ; 2. Après la création de l'instance ; 3. Avant le chargement de l'instance ; 5. Avant la mise à jour de l'instance ; Avant que l'instance ne soit détruite ; 8. Après que l'instance soit détruite.

Quelles sont les étapes du cycle de vie de vue ?

L'environnement d'exploitation de cet article : système Windows 10, Vue version 2.9.6, ordinateur DELL G3.

Quelles sont les étapes du cycle de vie de vue ?

Chaque instance de Vue passera par une série de processus d'initialisation lors de sa création. Le hook du cycle de vie de vue est une fonction qui est déclenchée lorsqu'une certaine étape ou condition est atteinte. Le but est de compléter certaines actions ou événements

  • Phase create : l'instance de vue est crééecreate阶段:vue实例被创建

beforeCreate: 创建前,此时data和methods中的数据都还没有初始化

created: 创建完毕,data中有值,未挂载

  • mount阶段: vue实例被挂载到真实DOM节点

beforeMount:可以发起服务端请求,去数据

mounted: 此时可以操作DOM

  • update阶段:当vue实例里面的data数据变化时,触发组件的重新渲染

beforeUpdate :更新前

updated:更新后

  • destroy阶段:vue实例被销毁

beforeDestroy:实例被销毁前,此时可以手动销毁一些方法

destroyed

beforeCreate : Avant la création, à ce moment données et méthodes Les données dans n'ont pas encore été initialisées

créé : Créées, il y a des valeurs dans les données, non montées

Étape mount : L'instance vue est montée sur le vrai nœud DOM

beforeMount : Vous pouvez lancer une demande de serveur pour supprimer les données

monté : Vous pouvez faire fonctionner le DOM à ce moment

Étape update : lorsque les données dans l'instance de vue changent, le nouveau rendu du composant est déclenché

beforeUpdate  : avant la mise à jour

mis à jour : Après la mise à jour

🎜🎜destroy phase : l'instance de vue est détruite🎜 ul>🎜beforeDestroy : avant la destruction de l'instance, A ce moment, vous pouvez détruire manuellement certaines méthodes🎜🎜destroyed : Après destruction🎜🎜🎜Cycle de vie des composants🎜🎜🎜 cycle de vie (composant parent-enfant) composant parent beforeCreate --> composant parent créé --> composant parent beforeMount --> Composant enfant monté --> Composant parent monté --> Composant parent avantMise à jour --> Composant enfant avantDestroy--> Composant parent mis à jour🎜🎜charger le processus de rendu parent avantCréer-> -> parent avantMontage-> enfant avantCréation-> enfant créé-> Enfant monté->Parent monté🎜🎜Phase de montage Parent créé->Enfant créé->Enfant monté->Parent monté🎜🎜Phase de mise à jour du composant parent Parent beforeUpdate->Parent mis à jour🎜🎜Phase de mise à jour du composant enfant Parent beforeUpdate ->Enfant avantUpdate->Enfant mis à jour->Parent mis à jour🎜🎜Phase de destruction Parent beforeDestroy->Enfant avantDestroy-> ;Enfant détruit->Parent détruit🎜🎜[Recommandation associée : "🎜Tutoriel vue.js🎜" 】🎜

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!

Déclaration:
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