10.07Vue生命周期函数

一.mvvm和mvc

1.MVVM和MVC基本定义:

①MVVM:

MVVM 即 Model-View-ViewModel 的简写，即模型-视图-视图模型，模型（Model） 指的是后端传递的数据，视图(View)指的是所看到的页面，视图模型(ViewModel)是 mvvm 模式的核心，它是连接 view 和 model 的桥梁。它有两个方向：

         1.1.1）一是将模型（Model）转化成视图(View)，即将后端传递的数据转化成所看到的页面，实现的方式是：数据绑定，

         1.1.2）二是将视图(View)转化成模型(Model)，即将所看到的页面转化成后端的数据。实现的方式是：DOM 事件监听，这两个方向都实现的，我们称之为数据的双向绑定

②MVC：

MVC 是 Model-View- Controller 的简写。即模型-视图-控制器。M 和V 指的意思和MVVM 中的 M（模型后端传递的数据） 和V（视图看到的页面） 意思一样。C 即 Controller 指的是页面业务逻辑，使用 MVC 的目的就是将M 和V 的代码分离。MVC 是单向通信。也就是 View 跟 Model，必须通过 Controller 来承上启下

2、使用场景

主要就是 MVC 中 Controller 演变成 MVVM 中的 viewModel，MVVM 主要解决了 MVC 中大量的 DOM 操作使页面渲染性能降低，加载速度变慢，影响用户体验，vue 数据驱动，通过数据来显示视图层而不是节点操作， 场景：数据操作比较多的场景，需要大量操作DOM 元素时，采用MVVM 的开发方式，会更加便捷，让开发者更多的精力放在数据的变化上，解放繁琐的操作DOM 元素

3、两者之间的区别

MVC 和MVVM 区别不大，都是一种设计思想， MVC 和MVVM 的区别并不是VM 完全取代了 C，只是在 MVC 的基础上增加了一层 VM，只不过是弱化了 C 的概念， ViewModel 存在目的在于抽离 Controller 中展示的业务逻辑，而不是替代 Controller，其它视图操作业务等还是应该放在 Controller 中实现，也就是说 MVVM 实现的是业务逻辑组件的重用， 使开发更高效，结构更清晰，增加代码的复用性

二.生命周期函数（2.0）-8大函数到底分别做了什么？

生命周期是同步的，请求是异步的，所以最好在挂载完以后执行。

 1.实例创建之前/之后

         beforeCreate： 实例初始化之后，组件被创建时期，这个时候的实例还没创建 data，message 都是 underfined不能使用

         created： 实例创建完成后，data、methods 被初始化，可以调用 但是页面还是空白的。是最早可以使用data和methods的钩子函数

2.组件挂载之前/之后：

         beforeMount ：组件挂载之前，完成初始化，被初次调用，这时节点还未渲染完成

         mounted：组件挂载之后，页面内容已渲染出，可访问到dom，此时模板渲染完成

3.数据改变视图更新之前/之后：

         beofreUpdate ：挂载开始之前调用 ，挂载完成之前访问现有 DOM ，比如手动移除已添加的事件监听器；也可以进一步修改数据

         updated ：由于数据更改，重新渲染界面时调用 可执行依赖于 DOM 的操作

4.实例销毁之前/之后:

         beforeDestroy： 实例销毁之前调用 是最后一次可以使用data和methods的钩子函数。

        destroyed： 实例销毁后调有。 调用后， 所有东西都会被解绑， 所有的事件监听器会被移动， 子实例也会被销毁 提示已删除

如果用 keep-alive 缓存了组件 就会有

        activated： keep - alive 组件激活时调用

        deactivated： 组件停用时调用

        errorCaptured 子组件出错的时候会触发这个钩子函

三.生命周期函数第一次挂载的时候，执行了那些？

        页面—beforeCreate

        页面—created

        页面—beforeMount

        组件—beforeCreate

        组件—created

        组件—beforeMount

        组件—mounted

        页面—mounted