Vue2系列-生命周期

112 阅读2分钟

面试了许多求职者,很多求职者只知其然,而不知所以然,写此文章为广大前端小伙伴指引迷津。纯干货!纯干货!纯干货!

目录

生命周期

什么是生命周期?

答:vue每个组件都是独立的,每个组件都有一个属于它的生命周期,从一个组件创建数据初始化挂载更新销毁,这就是一个组件所谓的生命周期。

简述每个周期具体适合哪些场景?
  • beforeCreate: 实例初始化。
  • created: 数据初始化,可访问data、computed、watch、methods、props上的方法和数据, 不能进行dom操作。
  • beforeMount: 挂载前,生成虚拟DOM。
  • mounted: 挂载完成,可以进行DOM操作,可以进行异步数据请求。
  • beforeUpdate: 数据更新前。
  • updated: 数据更新后,完成虚拟DOM的重新渲染和打补丁。
  • beforeDestroy: 销毁前, 清除wacther,子组件事件监听。
  • destroyed: 销毁后,当前组件已被删除。
生命周期的运行顺序?

答:props => methods =>data => computed => watch。

父子组件的生命周期?
  • 父组件开始执行到beforeMount 然后开始子组件执行,最后是父组件mounted。
  • 当子组件挂载完成后,父组件才会挂载。
面试大白话

答:首先vue每个组件都是独立的,每个组件都有一个属于它的生命周期,生命周期从一个组件创建数据初始化挂载更新销毁的过程。其过程会触发这几个钩子函数beforeCreate:实例初始化。created:数据初始化,可访问data、computed、watch、methods、props上的方法和数据,不能进行dom操作。beforeMount:挂载前,生成虚拟DOM。mounted: 挂载完成,可以进行DOM操作,可以进行异步数据请求。beforeUpdate: 数据更新前。updated: 数据更新后,完成虚拟DOM的重新渲染和打补丁。beforeDestroy: 销毁前, 清除wacther,子组件事件监听。destroyed:销毁后,当前组件已被删除。我们项目里面一般就是在mounted里面进行一些异步请求,以及dom操作当然父子组件生命周期也分先后顺序,父组件开始执行到beforeMount 然后开始子组件执行,最后是父组件mounted,子组件挂载完成后,父组件才会挂载。

小白也是新手面试官,欢迎领导莅临指导工作,提出建议,小白不胜感激,不喜勿喷,点赞收藏随机送程序媛小姐姐一枚哦!!!