1、前言
现在工作中用Vue也很多了，是时候总结一下自己使用Vue的心得了。其实，我并不知道从何开始去总结vue，因为vue的官方文档，可谓“中文开发者”的福音，实在是太全了！所以下面我还是从基本的东西说起——生命周期。
2、生命周期
通过之前的分享相信大家已经对Vue有了大概的了解，它是通过数据响应的，那么data中的数据一旦发生变化，页面的数据也随之变化，现在该谈谈生命周期的话题了。这下面的这幅图中，可以清晰地看到vue组件地从构造函数建立到销毁的全过程。
vue生命周期.png
- beforeCreate
在实例初始化之后，数据观测（Data Observer）和event/watcher事件配置之前被调用。 - create
实例已经创建完成之后被调用。在这一步，Dom挂载阶段还没开始。 - beforeMount
在挂载开始之前被调用 - mounted
挂载到实例上去之后调用该钩子函数 - beforeUpdate
数据更新时调用 - beforeDestroy
实例销毁之前调用 - destroyed
Vue实例销毁后调用。调用后，Vue实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。
下面我用代码展示一下：
new Vue({
el: '#app',
beforeCreate: function () {
console.log('调用了beforeCreat钩子函数')
},
created: function () {
console.log('调用了created钩子函数')
},
beforeMount: function () {
console.log('调用了beforeMount钩子函数')
},
mounted: function () {
console.log('调用了mounted钩子函数')
}
})
效果如下
demo.png
总结
关于vue的东西，其实还有很多。它的优越之处在于总结了angular1.0的失败之处，综合了react的优雅之点。同时，为前端程序员提供了良好的开发环境。
