vue的生命周期的相关问题

1、vue的生命周期那几个？每一个生命周期的特点,可以做什么？

  vue的生命周期就是vue实例从创建到销毁的过程就是生命周期，即指从创建、初始化数据、编译模板、挂载Dom到渲染、更新到渲染、销毁等一系列的过程。主要分为8个阶段：创建前后、载入前后、更新前后、销毁前后，以及一些特殊场景的生命周期。

生命周期	描述	作用
beforeCreate	创建前	这个时候data中的数据，还未定义，所以不能使用，执行一些初始化任务
created	创建后	最早开始使用 data和methods中数据的钩子函数，组件实例已经完全创建
beforeMount	挂载前	指令已经解析完毕内存中已经生成dom树，但是尚未挂载到页面中去，此时页面还是旧的。
mounted	挂载后	dom已经渲染完毕，此时页面和内存中都是最新的数据，最早可以操作DOM元素钩子函数
beforeUpdate	更新前	当视图层的数据发生改变会执行这个钩子 ， 内存更新，但是DOM节点还未更新，数据没有与页面同步
updated	更新后	数据更新完成以后触发的方法，DOM节点已经更新
beforeDestroy	销毁前	data和methods中的数据此时还是可以使用的，可以做一些释放内存、清除定时器、解绑事件等的操作
destroyed	销毁后	组件已经全部销毁，Vue实例已经被销毁，Vue中的任何数据都不可用

其他三个生命周期	描述
activated	被 keep-alive 缓存的组件激活时调用。
deactivated	被 keep-alive 缓存的组件停用时调用。
errorCaptured	捕获一个来自子孙组件的错误时被调用

  用 keep-alive包裹的组件在切换时不会进行销毁，而是缓存到内存中并执行deactivated钩子函数，命中缓存渲染后会执行activated钩子函数

Vue3.0中的生命周期做了一些改动：

生命周期	描述
beforeCreate -> setup()	开始创建组件之前，创建的是data和method
created -> setup( )
beforeMount -> onBeforeMount	组件挂载到节点上之前执行的函数。
mounted -> onMounted	组件挂载到节点上之前执行的函数。
beforeUpdate -> onBeforeUpdate	组件更新之前执行的函数。
Update - > onUpdated	组件更新完成之后执行的函数
beforeDestroy -> onBeforeUnmount	组件卸载之前执行的函数。
destroyed -> onUnmounted	组件卸载之前执行的函数。

• vue的实例加载完成是在哪个声明周期完成呢？-----
  beforeCreate（创建前）
• vue的dom挂载完成是在哪个声命周期里呢？-----mounted（挂载后）

2、created 和 mounted 的区别？

相同点：
  都能拿到实例对象的属性和方法，但是如果在mounted请求数据，有可能会导致页面闪动

不同点：

  created 模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。这时候页面dom节点并未生成

  mounted 在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。

  created的触发时机要比mounted更早一些

3、从A页面跳转到B页面执行了哪些生命周期？

A页面-----------> beforeCreate
A页面-----------> created
A页面-----------> beforeMount
A页面-----------> mounted
B页面-----------> beforeCreate
B页面-----------> created
B页面-----------> beforeMount

A页面-----------> beforeDestroy
A页面-----------> destroyed

B页面-----------> mounted

在B页面beforeMount挂载前和挂载后mounted之间A页面才执行销毁前后的钩子函数

4、一般在哪个生命周期请求异步数据？

  可以在created、beforeMount、mounted这三个钩子函数中进行调用，因为在这三个钩子函数中data已经创建，可以将服务端返回的数据进行赋值。
  建议在created钩子函数中请求数据，能更快获取服务端数据，减少页面加载时间，用户体验更好。
  SSR（服务端渲染）支持beforeMount、mounted钩子函数，放在created中有助于一致性；

5、父子组件的生命周期执行顺序？

1. 组件的加载渲染过程：
   父组件 -----> beforeCreate
   父组件 -----> created
   父组件 ------>beforeMount
   子组件 -------> beforeCreate
   子组件 -------> created
   子组件 -------> beforeMount
   子组件 --------> mounted
   父组件 --------> mounted

2. 更新过程：
   父组件 -----> beforeUpdate
   子组件 ------> beforeUpdate
   子组件-------> updated
   父组件-------> updated

3. 销毁过程
   父组件----->beforeDestory
   子组件----->beforeDestory
   子组件------>destroyed
   父组件------>destroyed

6、组件和页面的生命周期的实现顺序

页面 -----> beforeCreate
页面 -----> created
页面 ------>beforeMount
组件 -------> beforeCreate
组件 -------> created
组件 -------> beforeMount
组件 --------> mounted
页面 --------> mounted

7、生命周期钩子是如何实现的

Vue 的生命周期钩子核心实现是利用发布订阅模式，先把用户传入的的生命周期钩子订阅好（内部采用数组的方式存储），然后在创建组件实例的过程中会一次执行对应的钩子方法（发布）