Vue的生命周期函数
Vue 提供了一些生命周期函数，用于管理Vue实例中的各个阶段。生命周期函数包括：
* beforeCreate：实例创建之前，此时实例的data、methods等都还未初始化； * created： 实例已经创建完成，在这一步，我们就可以访问data、methods等了，但是还没有开始编译模板； * beforeMount：在挂载之前被调用，会在render函数之前调用，此时渲染的DOM还没有渲染到页面上； * mounted：挂载完成后调用，此时渲染的DOM已经渲染到页面上了； * beforeUpdate：数据更新时调用，但是此时DOM还没有更新； * updated：数据更新后调用，此时DOM也已经更新了； * beforeDestroy：实例销毁之前被调用，此时Vue实例还可以访问； * destroyed：实例已经被销毁，此时Vue实例已经无法访问，只能手动释放内存。
Vue生命周期的基本流程： 1. 初始化数据，实例化Vue对象时，会调用beforeCreate和created钩子，此时data、methods等还没有加载。 2. 更新DOM,在template中改变数据时，Vue会检测到数据变化，触发beforeUpdate和updated钩子，此时Vue会重新渲染DOM。 3. 销毁实例，在Vue实例销毁之前，会先调用beforeDestroy钩子，此时Vue实例仍然存活，以及所有的data、methods等还可以访问，最后调用destroyed钩子，Vue实例即被销毁。
下面是一个简单的Vue实例应用的生命周期的例子：
<!DOCTYPE html>
<html>
<head>
<title>Vue 生命周期</title>
</head>
<body>
<div id="app"></div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
var vm = new Vue({
el: '#app',
data: {
text: 'Hello, World!'
},
beforeCreate: function() {
console.log('beforeCreate');
},
created: function() {
console.log('created');
},
beforeMount: function() {
console.log('beforeMount');
},
mounted: function() {
console.log('mounted');
},
beforeUpdate: function() {
console.log('beforeUpdate');
},
updated: function() {
console.log('updated');
},
beforeDestroy: function() {
console.log('beforeDestroy');
},
destroyed: function() {
console.log('destroyed');
}
});
</script>
</body>
</html>