Vue的生命周期

 1 <div id="app">
 2     {{name}}
 3 </div>
 4 <script>
 5     const app=new Vue({
 6         el:‘#app‘,
 7         data:{
 8             name:‘大哥‘,
 9         },
10         methods:{
11             init:function () {
12                 console.log(123)
13             }
14         },
15         beforeCreate(){
16             console.group(‘beforeCreate‘);
17             console.log(this.$el);
18             console.log(this.name);
19             console.log(this.init);
20         },
21         created(){
22             console.group(‘created‘);
23             console.log(this.$el);
24             console.log(this.name);
25             console.log(this.init);
26         },
27         beforeMount(){
28             console.group("beforeMount");
29             console.log(this.$el);
30             console.log(this.name);
31             console.log(this.init);
32         },
33          mounted(){
34             console.group("mounted");
35             console.log(this.$el);
36             console.log(this.name);
37             console.log(this.init);
38         },
39         beforeUpdate(){
40             console.group("beforeUpdate");
41             console.log(this.$el);
42             console.log(this.name);
43             console.log(this.init);
44         },
45         updated(){
46             console.group("updated");
47             console.log(this.$el);
48             console.log(this.name);
49             console.log(this.init);
50         },
51         beforeDestroy(){
52             console.group("beforeDestroy");
53             console.log(this.$el);
54             console.log(this.name);
55             console.log(this.init);
56         },
57         destroyed(){
58             console.group("Destroy");
59             console.log(this.$el);
60             console.log(this.name);
61             console.log(this.init);
62         }
63     })
64 </script>