前端
面试题
前端
面试题

生命周期有哪些？

1.1 Vue2 生命周期钩子

钩子名称 说明
beforeCreate 实例刚被创建，属性观测(data observer) 和 event/watcher 事件配置之前被调用。
created 实例已经创建完成，属性观测和event/watcher事件配置已完成，但尚未挂载到DOM。可以访问到data、computed等属性。
beforeMount 挂载前，渲染函数首次被调用前执行。
mounted 实例被挂载到DOM上后调用，这时DOM节点可以被访问。
beforeUpdate 数据更新时调用，发生在虚拟DOM重新渲染和打补丁之前。
updated 数据更新后调用，发生在虚拟DOM重新渲染和打补丁之后，组件DOM已经更新。
activated 仅在keep-alive组件内，组件被激活时调用。
deactivated 仅在keep-alive组件内，组件被停用时调用。
beforeDestroy 实例销毁之前调用，此时仍然可以访问所有的属性和方法。
destroyed 实例已经被销毁，所有的子实例也被销毁，事件监听器已被移除，相关的DOM节点和其绑定的事件已解绑。
errorCaptured 当捕获一个来自子组件的错误时被调用,钩子函数收到三个参数：错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串，此钩子可以返回false以阻止该错误继续向上传播

1.2 Vue3 生命周期钩子（Composition API）

Vue3中，使用setup()函数替代了Vue2的data和methods等选项，并且引入了新的生命周期钩子，部分原有的钩子名称也做了调整。

钩子名称 用法
setup() 新增，组件的初始化入口，替代Vue2中的created和部分mounted逻辑，用于定义响应式数据和生命周期钩子。
onBeforeMount 相当于Vue2的beforeMount，挂载前调用。
onMounted 相当于Vue2的mounted，组件被挂载到DOM后调用。
onBeforeUpdate 相当于Vue2的beforeUpdate，数据更新前调用。
onUpdated 相当于Vue2的updated，数据更新后调用。
onActivated 与Vue2相同，仅在keep-alive组件内，组件被激活时调用。
onDeactivated 与Vue2相同，仅在keep-alive组件内，组件被停用时调用。
onBeforeUnmount 相当于Vue2的beforeDestroy，实例销毁前调用。
onUnmounted 相当于Vue2的destroyed，实例被销毁后调用。
onErrorCaptured 捕获了后代组件传递的错误时调用

1.3 发送请求是在created还是mounted？

这个问题具体要看项目和业务的情况了，因为组件的加载顺序是，父组件引入了子组件，那么先执行父的前3个生命周期，再执行子的前4个生命周期，那么如果我们的业务是父组件引入子组件，并且优先加载子组件的数据，那么在父组件中当前的请求要房mounted中，如果当前组件没有依赖关系那么放在哪个生命周期中请求都是可以的。

1.4 为什么发送请求不在beforeCreate里？beforeCreate和created有什么区别？

如果请求是在methods封装好了，在beforeCreate调用的时候，beforeCreate阶段是拿不到methods里面的方法的（会报错了）