生命周期

生命周期

初始化
自动执行
研究方向
数据
真实DOM
beforeCreate

  组件创建前
  作用：为整个生命周期做准备工作，初始化事件和自身或是子组件的生命周期做准备
  意义：1.数据拿不到  2.真实DOM拿不到

created

组件创建结束
作用：初始化注入其他选项和激活选项
意义：数据拿到了，但是真实DOM拿不到
项目中：1.数据请求，2.也可以修改一次数据

beforeMount

组件挂载前
    挂载：组件插入到页面前
意义：1.数据能拿到  2.真实DOM拿不到
项目中：1.数据请求，数据修改 2.建议不要去使用他，让他完成内部事务，不给加负担
内部完成事务 1.判断el选项-new Vue是否有el -
有，继而判断是否有template选项，证明有子组件
            - 有template,那么我们通过render函数将jsx解析为VDOM对象模型 
            - 无template,那么我们需要通过outerHTML手动渲染
              - outerHTML，元素外进行渲染，并且会代替原来的容器盒子，并且template在实例内会被解析，将来不会渲染到页面
          - 无： 那么我们需要手动挂载： new Vue().$mount('#app')

Mounted

组件挂载结束，也就是已经插入到页面中了
意义：1.数据能拿到  2.真实DOM能拿到
项目中：数据修改，数据请求  2.真实DOM操作【不推荐】
          - 理由：我们要用数据驱动视图
             - 应该做的：第三方实例化【静态数据】
运行中
运行中触发条件是 :数据改变  
只要数据改变，就会触发这两个钩子函数

beforeUpdate

组件更新前
类比：见面奔现失败后，再一次进行
意义：数据是可以拿到更新后的数据，也可以拿到更新后的真实DOM。为再一次的更新做准备工作，生成虚拟DOM
项目中 不常用

update

组件更新结束
意义：可以拿到修改后的数据，也可以拿到真实DOM
在项目中：
真实DOM操作   第三方库动态实例化
内部
销毁
触发条件：组件被删除
外部开关销毁
内部调用$destroy()

beforeDestroy

destroyed

外部销毁
      - 通过开关完成
        - DOM被删除了，组件也被删除了
    - 内部销毁
      - 通过调用$destroy()来完成
        - DOM没有被删除，但是组件被删除了
        - Dom需要手动删除
    - 项目中如何使用： 
      - 善后
        - 比如： 计时器，比如滚动事件等