MVC和MVVM
  Hj8ps7zq2eWQ 2023年11月02日 18 0

MVC

MVC全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范。

  • Model(模型)是应用程序中用于处理应用程序数据逻辑的部分。
  • View(视图)应用程序中处理数据显示的部分。
  • Controller(控制器)是应用程序中处理用户交互的部分。
    缺点:
  • 前后端职责纠缠不清
  • 对前端的发挥有一定的局限性

MVC和MVVM_Vue

MVVM

MVVM全名是Model-View-ViewModel的简写。它本质上就是MVC 的改进版。MVVM 就是将其中的View 的状态和行为抽象化,让我们将视图 UI 和业务逻辑分开。

  • Model(模型) 处理业务逻辑的操作
  • View(视图) 用于渲染数据的页面
  • VModel 负责视图和数据的双向数据绑定

MVVM的核心是 ViewModel 层,负责转换 Model 中的数据对象来让数据变得更容易管理和使用,其作用如下:

  • 该层向上与试图层进行 双向数据绑定 ???
  • 向下与 Model 层通过接口请求进行数据交互

MVC和MVVM_Vue_02

为什么要使用MVVM MVVM模式主要的目的是分离视图(View)和模型(Model),有几大好处:

  • 低耦合:视图(View)可以独立与Model变化和修改,一个ViewModel 可以绑定到不同的 View上,当 View变化的时候 Model 可以不变,当Model变化的时候View也可以不变。
  • 可复用:你可以把一些视图逻辑放在一个 ViewModel里面,让更多 VIew重用这段视图逻辑
  • 独立开发:开发人员可以专注于业务逻辑和数据的开发(ViewModel),设计人员可以专注于页面设计
  • 可测试:界面素来是比较难于测试的,而现在测试可以针对 ViewModel 来写

什么是Vue

Vue是一个遵循MVVM模式的渐进式框架.它的作者尤雨溪(Evan You)是一位美籍华人,下面是作者本人对于Vue框架产生的描述:"Vue 一开始完全是一个个人兴趣项目。2013 年的时候我还在谷歌工作,那时候前端框架还处于比较草莽的阶段,React 刚刚发布还没几个人知道,最成熟的是 AngularJS (Angular 1)。我当时一方面是想自己实现一个简单的框架练练手,另一方面是想尝试一下用 ES5 的 Object.defineProperty 实现数据变动侦测。众所周知 AngularJS 使用的是脏检查,而当时大部分的应用还需要支持 IE8,所以不能全面使用 ES5,而个人项目则不需要考虑这些,(所以Vue项目从一开始就不支持IE8以下版本)Vue 就是这样作为一个实验性质的项目开始的"

读音:

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式JavaScript框架。简单小巧的核心,渐进式技术栈,足以应付任何规模的应用。

特点

  • Vue比较易学,体积更小(30多kb),灵活,高效。
  • Vue的本身只关注UI视图,可以更简单的导入Vue插件和第三方库
  • Vue通过Vue对象把数据和视图完全分离开来,对视图的改变无需在操作DOM元素,只需要操作对应的数据,即可改变对应的视图结构,也就是通过双向数据绑定把View层和Model层连接了起来,通过对数据的操作就可以完成对页面视图的渲染。


【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年11月08日 0

暂无评论

推荐阅读
  gYl4rku9YpWY   2024年05月17日   60   0   0 Vue
  onf2Mh1AWJAW   2024年05月17日   63   0   0 Vue
  3A8RnFxQCDqM   2024年05月17日   60   0   0 Vue
Hj8ps7zq2eWQ
作者其他文章 更多

2023-11-02