Vue生命周期探索

vue中生命周期分为初始化，跟新状态，销毁三个阶段

• 1.初始化阶段：beforeCreated，created，beforeMount，mounted

• 2.跟新状态：beforeUpdate，update

• 3.销毁vue实例：beforeDestory，destoryed

• 其中created/mounted 可以用来发送ajax请求，启动定时器等异步任务

• beforeDestroy用来收尾工作，如清除定时器

• Vue在实例化一个组件时会在特定的阶段调用特定的方法，调用的这个方法就叫钩子方法，比如Vue在实例化组件之初按顺序调用beforeCreated，created，beforeMounted，mounted，每个阶段组件内部的属性都是不一样的，比如created钩子时视图还没有渲染，就不能做一些dom操作。所以一般特定的钩子做特定的事，比如ajax获取数据就可以在mounted阶段，当然放在created，beforeMounted也是可以的，因为ajax是异步的，ajax之后的回调会放在事件队列的尾部，此时实例化组件整个过程会在ajax回调之前执行完毕。所以ajax操作放在created，mounted里面都是可以的。

• 具体可以参照下列图片

注意事项

不要在选项属性或回调上使用箭头函数，比如 created: () => console.log(this.a) 或 vm.$watch('a', newValue => this.myMethod())。因为箭头函数并没有 this，this 会作为变量一直向上级词法作用域查找，直至找到为止，经常导致 Uncaught TypeError: Cannot read property of undefined 或 Uncaught TypeError: this.myMethod is not a function 之类的错误。