Huit fonctions hook du cycle de vie de Vue

Nom de la méthode	sens
avantCréer	Appelé avant l'initialisation des données. À ce stade, les données et les méthodes ne contiennent aucune donnée.
créé	Appelé après l'initialisation des données, les données et les méthodes à ce moment ont des données correspondantes.
beforeMount	Utilisé lorsque la page n'a pas été rendue, c'est-à-dire que les données Vue n'ont pas été transmises à la page.
monté	Utilisé après le rendu de la page, c'est-à-dire que la page a complètement retiré les données de Vue à ce moment.
beforeUpdate	Avant la mise à jour des données.
mis à jour	mise à jour des données.
avant de détruire	Avant que le composant ne soit détruit.
détruit	Une fois le composant détruit.

code demo.vue

<template>
  <div id="app">
    {
    
    {
    
    msg}}
    <button @click="dochange()">Change Content</button>
  </div>
</template>
<script>

export default {
    
    
  data(){
    
    
    return {
    
    
      msg:"hello"
    }
  },mounted(){
    
    
    console.log("this is my demo ....");
  },beforeCreate(){
    
    
    console.log("before created");
  },created(){
    
    
    console.log("created");
  },beforeMount(){
    
    
    console.log("before mount");
  },mounted(){
    
    
    console.log("mounted");
  },beforeUpdate(){
    
    //当数据发生改变得时候
    console.log("before update");
  },updated(){
    
    //当数据发生改变得时候
    console.log("updated");
  },beforeDestroy(){
    
    
    console.log("before destroy");
  },destroyed(){
    
    
    console.log("destroyed");
  },methods:{
    
    
    dochange(){
    
    
      this.msg="world";
      console.log("change...");
    }
  }
}
</script>