vue面试题 - 生命周期

一、生命周期

总共分为8个阶段

（1）创建前/后

（2）载入前/后

（3）更新前/后

（4）销毁前/后

    1.1 创建前/后 

    1）beforeCreate 阶段
        vue实例的挂载元素el和数据对象data都是undefined，还未初始化
        说明：data、methods、computed、watch上的数据和方法都不能被访问
    2）created阶段
        vue实例的数据data有了，但是el还没有
        可以做一些初始化数据的获取，或者ajax接口调用，但是无法与dom进行交互，当然如果非要操作，可以用vm.$nextTick
 
 
   1.2 载入前/后
   1） beforeMount阶段 
       vue实例的挂载元素el和数据对象data都初始化，虚拟dom节点创建完成
       说明：即将开始渲染到页面。
   2）mounted阶段
       vue实例挂载完成，data成功渲染
       说明：真实dom挂载完毕，数据完成双向绑定，可以访问dom节点，使用$refs属性对dom进行操作
  
  
   1.3 更新前/后
   1）beforeUpdate阶段 
      虚拟dom重新渲染前，data的值发生改变调用
   2）updated阶段
      虚拟dom重新渲染完成
      
      
   1.4 销毁前/后
   1） befoeDestroy阶段
       实例销毁前调用，常用于销毁定时器，解绑事件，data和methods都可以使用
   2） destroyd阶段
       实例销毁后，data和methods都不可以用

第一次加载时会触发

beforeCreate -> created -> beforeMount -> mounted

1）created （数据请求）

2）mounted (操作dom)

为什么不在mounted中获取请求

请求数据可能导致页面闪屏问题，加载时机问题，放在created里会比mounted触发早一点