生命周期图
自己测试一下
看一下输出值
beforeCreate在实例初始化之后执行，此时的data数据还未装配，$el 还为undefined
created实例创建完毕后被调用，此时data和属性方法已经有了，但是没有挂载到页面上，$el 还为undefined
beforeMount在挂载之前被调用，$el 还为undefined
mounted挂载完毕，el被新创建的vm.$el替换，页面上渲染元素成功
beforeUpdate数据更新时调用，虚拟dom打补丁之前，数据是更新后的数据
updated数据更改导致虚拟dom重新渲染和打补丁，在这之后调用该方法
beforeDestroy实例销毁之前调用，data数据和上面的方法依旧存在，$el 还能获得到dom元素
destroyed实例销毁后，data数据和上面的方法依旧存在，$el 已经被删除了
数据
data Vue实例数据对象。Vue将会递归将data的属性转为getter/setter，从而让data的属性能够响应数据变化
props 可是数组或对象，用于接收父组件的数据
propsData 创建实例时传递的props，只能用于new创建的实例
computed 计算属性
methods 方法集合
watch 数据对象的观察
DOM
el Vue实例的挂载目标
template 字符串模板
render 字符串模板代替方案
renderError 当render出错时的方案
资源
directives Vue实例可用指令的集合
filters 过滤器的集合
components 子组件集合
组合
parent 父组件实例
mixins 混入实例的数组集合
extends 扩展文件组件
provide/inject 高阶插件/组件库提供用例
其他
name 作为组件时组件的名字
delimiters 默认值为{{ }} 可改变在html页面数据包含标示
functional 使组件无状态和无实例
model允许一个自定义组件在使用v-model时定制prop和event
inheritAttrs 默认行为将被干掉
comments 注释将被干掉
总结
beforecreate这可以加个loading事件
created在这做一些初始化结束loading
mounted调用接口那到数据配合其他钩子函数
beforeDestory清除计时器之类
data为页面响应式数据集合
props 用于父组件给子组件传递数据
computed用于计算属性
watch用于监听数据变化
模板的话平时常用template，也可以用类react的render
filters 是过滤器的集合
components 是实例子组件的集合
parent 是父组件
mixins 用于给实例混入一些属性