详解vue生命周期

首先，每个Vue实例在被创建之前都要经过一系列的初始化过程,这个过程就是vue的生命周期。首先看一张官方图片:

可以看到在vue一整个的生命周期中会有很多钩子函数提供给我们在vue生命周期不同的时刻进行操作, 那么先列出所有的钩子函数，然后我们再一一详解:

• beforeCreate
• created
• beforeMount
• mounted
• beforeUpdate
• updated
• activated
• deactivated
• beforeDestroy
• destroyed

来波代码,复制在浏览器中运行，打开console查看就行了：

<script>
	var Vcontent = {
   
            template: `
              <div>
                <span>{
    {msg}}</span>
                <button @click="changeDate">改变</button>
              </div>
            `,
            data() {
   
                return {
   
                    msg: 'helloword'
                }
            },
            methods: {
   
                changeDate() {
   
                    this.msg = this.msg + '哈哈哈'
                }
            },
            beforeCreate:function() {
   
				// 组件创建之前
				console