vue生命周期钩子

生命周期函数：Vue实例在某个时间点会自动执行的函数

 Vue在创建执行销毁的过程中，有周期生命钩子去监听。周期生命钩子不写在methods中，而是跟methods同一级别。

[code]    <div id="demo">
</div>
<script>

var vm = new Vue({
el: '#demo',
template: "<div v-on:click='count++'>{{count}}</div>",
data: {
count: 0
},
beforeCreate: function(){
console.log('vue创建时，执行')
},
created: function(){
console.log("vue创建完成后执行")
},
beforeMount: function(){
console.log("将要进行页面渲染时，执行")
},
mounted: function(){
console.log("页面渲染后执行")
},
beforeUpdate: function(){
console.log("将要更新数据时，执行")
},
updated: function(){
console.log("更新数据后执行")
},
beforeDestroy: function(){
console.log("在vue实例将要销毁的时候，执行")
},
destroyed: function(){
console.log("vue实例销毁后执行")
}
})
</script>

结果：页面刷新的时候，会执行创建vue和页面渲染相对应的四个周期生命钩子，当点击的时候，数字发生变化，此时触发beforeUpdate和updated函数，当销毁vue时，如下图，会触发beforeDestroy和destroyed函数 

注意：vue实例中也可以写template模板，其效果是div标签和html中的div标签是同一个标签。

2. 关于vue的响应式数据，

只有vue被创建时data中已存在的属性，才可以是响应式的，而后来给data对象添加的属性是不能响应式的

Object.freeze（对象）方法，不允许该对象内的属性具有响应式效果