第34题：说一说Vue的生命周期？ about fe-interview HOT 2 OPEN

1.vue有一般情况下有初始化、挂载、更新和销毁四个生命周期，以及四个生命周期对应的八个钩子函数；
2.
在初始化周期的钩子函数包括beforeCreate()和created()，created()在vue中data、methods等里面的数据生成后触发，实际开发中一般会在created()中进行进行获取页面初始数据以及一些静态数据的操作；
挂载周期包括deforeMount()和mounted()两个钩子函数，分别表示真实DOM结构挂载之前和挂载触发，实际开发中如果需要在DOM加载之后第一时间对DOM进行操作，一般会在mounted()钩子函数中进行；
更新周期包括beforeUpdata()和updated()两个钩子函数，分别表示数据更新之前和数据更新之后触发，但实际开发中一般不会使用这两个函数，因为当数据频繁更新时，每一次数据更新就会触发一次对应的函数，会造成循环，如果需要对数据更新进行监视触发一定的逻辑，可以通过监听器watch来实现；
销毁阶段包括beforeDestroy()和destroyed()两个钩子函数，表示vue实例销毁前和销毁后触发的函数，实际开发中一般会在beforeDestroyed()中对定时器、计时器等进行关闭，如果不关闭，当组件销毁后定时器也会继续执行；
3.除了以上八个钩子函数外，当组件中使用keep-alive缓存组件时，vue会触发两个全新的钩子函数，分别是激活时触发的activated()和失活时触发的deactivated()，此时上面的八个钩子函数会失效；

from fe-interview.

vue生命周期和钩子函数

1. vue生命周期是指 vue实例/组件 从创建到销毁的过程。

2. Vue生命周期一般有4个阶段（初始化，挂载，更新，销毁），每个阶段的前后都有一个钩子函数。

beforeCreate => created => beforeMount => mounted => beforeUpdate => updated => beforeDestroy => destroyed

阶段	方法名	方法名
初始化	beforeCreate	created
挂载	beforeMount	mounted
更新	beforeUpdate	updated
销毁	beforeDestroy	destroyed

3. created ： 当数据与方法初始化完成后执行的函数，此时可以在当前函数中使用方法与数据 - 常用来在这个阶段获取后端数据。

4. mounted ：当真实dom挂载到页面上之后执行的函数，此时可以在函数中操作dom，并且可以执行所有在created中执行的逻辑。

=> 如果一个方法很难判断在created或者是mounted中执行时，直接放到mounted中即可

5. 更新阶段的2个函数beforeUpdate、updated 存在 死循环数据更新 的问题，所以如果需要监听某个数据发生的变化时，用watch监听器来代替更新阶段的钩子函数。

6. beforeDestroy：如果当前组件中定义了全局的异步操作(主要是定时器)，那么在销毁前 （beforeDestroy ）时需要主动关闭这些异步操作。

7. 其他的三个钩子函数：

• errorCaptured: 当捕获一个来自子孙组件的错误时被调用。

• activated: 被 keep-alive 缓存的组件激活时调用。

• deactivated: 被 keep-alive 缓存的组件停用时调用。

from fe-interview.