VUE生命周期指的是vue实例从创建到销毁的过程。
生命周期的几个阶段： 创建阶段执行1次，运行阶段执行0~N次，销毁阶段最多执行1次
- 初始化阶段
- beforeCreate：实例刚创建完成，此时还没有data和methods属性
beforeCreate() {
// 还未进行数据代理
// 此时无法通过vm访问data中的数据，methods中的方法
}
- created:vue实例data和method属性已经初始化完成，此时还没有编译模板。created在生命周期中非常有用，此阶段获取到了数据但没进行页面结构渲染，常用于调用methods中的Ajax请求和后台请求。
created() {
// 已完成初始化
// 可以通过vm访问data中的数据，methods中的方法
}
- 实例挂载阶段
- beforeMount：挂载前，模板编译完成，此时el还没有挂载，data可见，此阶段还未将编译好的HTML结构渲染到浏览器，所以无法操作Dom。此阶段也能进行Ajax请求，但Ajax请求最早可在created阶段发送，一般越早发送请求拿到数据越好。
beforeMount() {
// 页面呈现的是未经Vue编译的DOM页面
// 所有对DOM的操作，最终都不会起作用
}
- mounted：挂载完成后，模板编译完成，$el挂载完成，已经把HTML渲染到页面。此阶段是操作当前组件DOM的最早阶段。
mounted() {
// 页面呈现的是经Vue编译的DOM页面
// 对DOM的操作，会起作用
}
- 数据更新阶段/运行阶段（最少执行0次，最多无限次）
- beforeUpdate：数据更新时执行，data数据此时已经是最新的数据，UI界面还是旧的。
beforeUpdate() {
// 此时数据已更新，但页面还是旧的
// 数据与页面不一致
}
- updated：数据更新完成后，data和界面里的数据此时都是最新的，完成界面的更新渲染render。
updated() {
// 此时数据和页面都已更新
},
- 销毁阶段
- beforeDestroy：销毁前，实例准备销毁，此时data和methods方法都能用，组件将要销毁但尚未销毁。
beforeDestroy() {
// vm中所有的data、methods、指令都可以用
// 在此阶段一般进行：关闭定时器，解除自定义事件等操作
}
- destroyed：销毁后，实例销毁完成，此时原先创建的属性和实例方法都不可使用，此组件在浏览器中对应的Dom结构已经完全移除了。
destroyed() {
// vm中所有的data、methods、指令都不可以用
}
生命周期的详细执行顺序： 单组件情况下：
- 进入页面默认会自动执行beforeCreate -> created -> beforeMount ->mounted。
- 当数据发生改变的前一刻会自动执行beforeUpdate，当数据改变完成会自动执行updated。
- 当页面准备销毁的前一刻会自动执行beforeDestroy，当页面准备销毁完成会自动执行destroyed。
- 注意事项：
- beforeCreate：再执行该函数时，data、methods、computed在this中无法获取
- created：在执行该函数时，$data、methods、computed在this中可以获取（如果不需要操作DOM可以在此阶段发起网络请求）
- beforeMount：template准备挂载
- mounted：在执行该函数时，$el可以在this中访问（可以发起网络请求）
父子组件执行顺序：
- 进入页面自动执行的生命周期钩子有：
- 1.首先会自动执行父组件的生命周期钩子beforeCreate -> created -> beforeMount
- 2.然后会自动执行子组件的生命周期钩子beforeCreate -> created -> beforeMount -> mounted
- 3.最后再自动执行父组件的生命周期钩子mounted
- （ 当组件数据发生改变，组件各自执行各自的生命周期钩子beforeUpdate、updated ）
- 当页面被销毁时，父组件会先执行beforeDestroy，子组件再执行beforeDestroy、destroyed，最后父组件执行destroyed
