面试官:你对vue生命周期的理解是什么?1、什么是生命周期?生命周期的概念应用广泛,尤其是在政治、经济、环境、科技、社会等诸多领域。它的基本含义可以理解为“从摇篮到坟墓”Vue中(Cradle-to-Grave)的整个过程就是一个实例从创建到销毁的生命周期,指的是实例从创建、初始化等一系列过程数据、模板的编译、Dom的挂载→渲染、更新→渲染、卸载等。我们可以将一个组件比作工厂中的一条流水线。每个工人(生命周期)都站在自己的位置上。当任务流向worker时,worker开始工作。PS:Vue生命周期中的hook会自动将这个Context绑定到实例上,这样你就可以访问数据,对属性和方法进行操作了。这意味着您不能使用箭头函数来定义生命周期方法(例如created:()=>this.fetchTodos())。二、生命周期有哪些Vue的生命周期一共可以分为8个阶段:创建前后、加载前后、更新前后、销毁前后以及一些特殊场景的生命周期生命周期说明beforeCreate当创建的组件实例完全创建时创建组件实例beforeMount组件挂载在被挂载的组件被挂载到实例之前,beforeUpdate组件数据变化,在更新数据之前更新,beforeDestroy组件实例被销毁,被销毁的组件实例被销毁之前,activatedkeep-alive缓存组件在deactivated时被激活keep-alive缓存组件在deactivated时调用ErrorCaptured从后代组件捕获错误3.生命周期整体流程Vue生命周期解释图具体分析beforeCreate->created初始化vue实例,执行数据观察创建完成数据observation、property和method操作,watch和event事件回调的配置可以在methods中调用方法,访问和修改data数据触发响应式渲染dom,通过computed和watch完成数据计算,此时vm.$el还没有被创建created->beforeMount判断是否存在el选项,如果不存在则停止编译,直到vm.$mount(el)被调用。优先级:渲染>模板>outerHTMLvm.el获取的是挂载DOM的beforeMount。这个阶段可以得到vm.el。vm.el虽然在这个阶段完成了DOM初始化,但是并没有挂载在el选项上。beforeMount->mountedvm.el这个阶段挂载完成,vm.$el生成的DOM替换el选项对应的DOM。Mountedvm.el已经完成了DOM的挂载和渲染。现在打印vm.$el,发现之前的挂载点和内容已经换成了新的。DOMbeforeUpdate中更新的数据必须渲染到模板(el、template、render之一)上。这个时候view层还没有更新。如果在beforeUpdate中再次修改了数据,则不会再次触发updated方法完成视图层的更新。如果在updated中再次修改数据,会在beforeDestroy实例销毁前再次调用update方法(beforeUpdate,updated)。此时仍然可以通过destroyed来访问实例的属性和方法,从而彻底销毁一个实例。它可以清理它与其他实例的连接,解除绑定它的所有指令和事件监听器不能清除DOM,只销毁实例使用场景分析
