2019-04-08生命周期(钩子函数 hook)

生命周期(钩子函数 hook)函数就是vue实例在某一个时间点会自动执行的函数

            //此时vue实例已经进行了基础的初始化，但data数据还没有绑定到vue的实例，此时，访问不到data数据
            beforeCreate(){
                console.log('beforeCreate',this.msg);
            },
            //此时，data数据已经注入vue的实例，我们可以通过this访问到data数据
            created(){
                console.log('created',this.msg);
            },
            //此时，模板和数据已经结合，编译，但还没有挂载到指定的挂载点上 （或者没有挂载到指定的页面元素上）
            beforeMount(){
                console.log('beforeMount',this.$el);
            },
            //此时，编译后的模板已经挂载到挂载点上，我们会看到加载了数据的视图的更新
            mounted(){
                console.log('mounted',this.$el);
                // this.msg = "world"   //此时更改数据可以触发beforeUpdate钩子函数
            },

            //当有数据发生改变时，模板重新渲染之前，会触发该事件。
            beforeUpdate(){
                console.log('beforeUpdate',this.$el.innerHTML);
            },
            //当模板重新渲染之后，触发该事件
            updated(){
                console.log('updated',this.$el.innerHTML);
            },
            // 当执行vm.$destroy()，vue实例销毁之前发生
            beforeDestroy(){
                console.log('beforeDestroy');
            },
            //vue实例销毁之后发生，此时再改变数据，不会触发视图更新（或者视图重新渲染）
            destroyed(){
                console.log('destroyed');
            }

也可以通过vm.$mount注册挂载点

      vm.$mount('#app');