生命周期、swiper、自定义指令、cli

一、生命周期

1. 什么是生命周期？
   vue中的生命周期指的是 组件 从创建到销毁一个过程，在这个过程中，我们在每一个特定的阶段会触发一些方法（ 这些方法具备一些功能），我们给这些方法起了个名字叫做（ 生命周期钩子函数/ 组件钩子 ）

2. 为什么要学习生命周期？
   因为我们想在生命周期钩子中实现项目功能，那么我们必须知道每一个钩子函数的具体用途

3. 这个生命周期是谁的生命周期？
   组件

4. 项目中生命周期如何书写（ 功能 ）

   ## 生命周期

   Vue的生命周期分为三个阶段，分别为： 初始化，运行中， 销毁，一共8个钩子函数

   ​ 注意： 生命周期钩子函数不允许写成箭头函数

   #### 初始化：

   ​ beforeCreate

   ​ 1. 组件创建前触发，目的是为了组件的生命周期 和 组件中的事件做准备

   ​ 2. 数据没有获得，真实dom也没有渲染出来

   ​ 3. 可以进行数据请求，提供了一次数据修改的机会

   ​ 4. 执行一次

   ​ created

   ​ 1. 组件创建结束

   ​ 2. 数据得到了，真实dom没有渲染出来

   ​ 3. 可以进行数据请求，提供了一次数据修改的机会

   ​ 4. 执行了一次

   ​ beforeMount

   ​ 1. 组件挂载前

   ​ 2. 任务： 判断el 判断 template

   ​ 如果el没有，那么我们需要手动挂载，如果有，那么判断template

   ​ 如果template有，那么进行render函数

   ​ 如果template没有，那么通过 outerHTML 手动书写模板

   ​ 3. 数据可以获得，但是真实dom还没有渲染

   ​ 4. 可以进行数据请求，也提供了一次数据修改的机会

   ​ 5. 执行一次

   ​ mounted

   ​ 1. 组件挂载结束

   ​ 2. 数据获得了，真实dom也获得了

   ​ 3. 可以进行数据请求，也就可以修改数据

   ​ 4. 执行了一次

   ​ 5. 可以进行真实dom的操作了（ 可以进行第三方库的实例化了 ）

   总结：

   \1. 数据请求一般写在created里面

   \2. 第三方库实例化我们一般会往mounted中写

   #### 运行中

   ​ 触发条件：数据更新

   ​ beforeUpdate

   ​ 1. 更新前

   ​ 2. 重新渲染 VDOM , 然后通过diff算法比较两次vdom,生成patch 补丁对象

   ​ 3. 这个钩子函数更多的是内部进行一些操作，我们就不在多干预了

   ​ 4. 可以触发多次

   ​ updated

   ​ 1. 更新结束

   ​ 2. 真实dom得到了，数据也得到了（ 更新后的 ）

   ​ \3. 动态数据获取（ 第三方库实例化 ）

   #### 销毁

   触发条件： 当组件销毁时：

   ​ beforeDestroy

   ​ destroyed

   这两个钩子功能一致的，这两个钩子没有太大的区别

   用来做善后的,比如计时器的关闭 第三方实例的删除

   外部销毁不仅能销毁组件，