Que signifie détruire en vue ?

Dans vue, destroy signifie "destroy", qui fait référence aux fonctions de cycle de vie beforeDestory() et destroy() des deux étapes de destruction de l'instance de vue ; beforeDestory() signifie avant destruction, destroy() Indique après destruction.

Le cycle de vie de Vue fait référence au processus allant de la création à la destruction de l'objet instance Vue. La mise en œuvre de toutes les fonctions de Vue s'effectue autour de sa vie. L'appel des fonctions hook correspondantes à différentes étapes du cycle de vie peut réaliser deux fonctions importantes : la gestion des données des composants et le rendu DOM.

Le cycle de vie de vue peut être divisé en huit étapes, à savoir :

beforeCreate (avant la création), créé (après la création), avantMont (avant le chargement), monté (après chargement), beforeUpdate (avant mise à jour), mis à jour (après mise à jour), beforeDestroy (avant destruction), détruit (après destruction)

Jetons un coup d'œil à ces huit étapes du cycle de vie d'une vue :

1. BeforeCreate La fonction hook correspondante de

est beforeCreate. Cette étape a lieu après l'initialisation de l'instance. À ce stade, les mécanismes d'observation des données et d'événements n'ont pas été formés et le nœud DOM ne peut pas être obtenu.

2. Après création (créé)

La fonction hook correspondante est créée. A ce stade, l'instance de vue a été créée, mais l'élément DOM ne peut toujours pas être obtenu.

3. Avant le chargement (beforeMount)

La fonction hook correspondante est beforemount À ce stade, bien que nous ne puissions toujours pas obtenir l'élément DOM spécifique, le nœud racine du montage vue Déjà créé, les opérations Vue suivantes sur le DOM se poursuivront autour de cet élément racine ; l'étape beforeMount est transitoire et ne peut généralement être utilisée qu'une ou deux fois dans un projet.

4. Après chargement (monté)

La fonction crochet correspondante est montée. Mounted est la fonction que nous utilisons le plus souvent. Généralement, nos requêtes asynchrones sont écrites ici. À ce stade, les données et le DOM ont été rendus.

5. BeforeUpdate (beforeUpdate)

La fonction hook correspondante est beforeUpdate. À ce stade, Vue suit le principe du DOM basé sur les données : bien que la fonction beforeUpdate ne mette pas à jour les données immédiatement après la mise à jour des données, les données du DOM changeront. C'est le rôle de la liaison de données bidirectionnelle de Vue.

6. Après mise à jour (mis à jour) La fonction hook correspondante de

est mise à jour. A ce stade, le DOM sera synchronisé avec le contenu modifié.

7. Before Destroy (beforeDestroy)

La fonction hook correspondante est beforeDestroy. Dans l'étape précédente, vue a réussi à piloter les mises à jour du DOM via les données. Lorsque nous n'avons plus besoin de vue pour manipuler le DOM, nous devons détruire Vue, c'est-à-dire effacer l'association entre l'instance de vue et le DOM et appeler la méthode destroy. pour détruire le composant actuel. Avant la destruction, la fonction hook beforeDestroy sera déclenchée.

8. Après destruction (détruit)

La fonction hook correspondante est détruite. Après destruction, la fonction hook détruite sera déclenchée.

L'idée du cycle de vie de vue traverse tout le développement des composants. En se familiarisant avec son cycle de vie et en appelant différentes fonctions de hook, nous pouvons contrôler avec précision le flux de données et son impact sur le DOM ; L'idée du cycle de vie de vue est une incarnation vivante et un héritage de Vnode et MVVM.

Recommandations associées :

Résumé des questions d'entretien Front-end Vue 2020 (avec réponses)

tutoriel vue Recommandé : Les 5 dernières sélections de didacticiels vidéo vue.js en 2020

Pour plus de connaissances liées à la programmation, veuillez visiter : Enseignement de la programmation ! !

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!