MVC和MVVM区别和VUE关系

MVC(Model-View-Controller)和 MVVM(Model-View-ViewModel)是两种常见的前端架构模式,它们的主要区别在于处理业务逻辑和数据操作的方式。

MVC中,View(视图)可以直接访问Model(模型),而Controller(控制器)主要负责收集数据,并将数据从Model传递给View来完成交互。在MVC中,Controller承担了大量的责任,随着项目复杂度的增加,Controller中的代码可能会变得过于庞大和复杂,不利于维护。

相比之下,MVVM在处理业务逻辑和数据操作上更加灵活。ViewModel是一个同步Model和View的对象,Model和View之间没有直接的联系,而是通过ViewModel来实现交互。在MVVM架构下,Model和View的同步是通过双向绑定实现的,这意味着View的数据会同步到Model上,Model的数据变化也会即时显示在View上。这种自动同步的特性使得MVVM能够解决MVC中的大量DOM操作导致页面渲染速度降低、加载速度过慢等问题。

总的来说,MVC和MVVM都是为了实现Web系统的职能分工,但MVVM通过将数据绑定工作放到一个JS里去实现,解决了MVC中Controller承担过多责任的问题,使代码更易于维护。此外,MVVM通过双向绑定实现了Model和View的自动同步,提高了页面渲染速度和用户体验。

MVVM 新增了 VM 类
ViewModel 层:做了两件事达到了数据的双向绑定⼀是将【模型】转化成【视图】,即将后端传递的数据转化成所看到的页⾯。实现的⽅式是:数据绑定。⼆是将【视图】转化成【模型】,即将所看到的页⾯转化成后端的数据。实现的⽅式是:DOM 事件监听。MVVM 与 MVC 最⼤的区别就是:它实现了 View 和 Model 的⾃动同步,也就是当 Model 的属性改变时,我们不⽤再⾃⼰⼿动操作 Dom 元素,来改变 View 的显⽰,⽽是改变属性后该属性对应 View 层显⽰会⾃动改变(对应Vue数据驱动的思想)
整体看来,MVVM ⽐ MVC 精简很多,不仅简化了业务与界⾯的依赖,还解决了数据频繁更新的问题,不⽤再⽤选择器操作 DOM 元素。因为在 MVVM 中,View 不知道 Model 的存在,Model 和 ViewModel 也观察不到 View,这种低耦合模式提⾼代码的可重⽤性
注意:Vue 并没有完全遵循 MVVM 的思想这⼀点官⽹⾃⼰也有说明
那么问题来了为什么官⽅要说 Vue 没有完全遵循 MVVM 思想呢?
严格的 MVVM 要求 View 不能和 Model 直接通信,⽽ Vue 提供了$refs 这个属性,让 Model 可以直接操作 View,违反了
这⼀规定,所以说 Vue 没有完全遵循 MVVM。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/637623.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

低代码+物联网: 重塑智慧社区,开启未来生活新纪元

在数字化时代的推动下,人们对于智能化生活的需求不断增长。而作为连接物理世界和数字世界的重要桥梁,物联网技术发挥着至关重要的作用。最近几年,低代码开发平台的兴起更是给物联网应用开发带来了革命性的改变。本文将探讨低代码和物联网的结…

2024首更---Web Service 教程

Web Services 简介 Web Services 可使您的应用程序成为 Web 应用程序。 Web Services 通过 Web 进行发布、查找和使用。 您应当具备的基础知识 在继续学习之前,您需要对下面的知识有基本的了解: HTMLXML 如果您希望首先学习这些项目,请在…

2024年华数杯国际赛A题:放射性废水处理建模 思路模型代码解析

2024年华数杯国际赛A题:放射性废水处理建模(Radioactive Wastewater from Japan) 一、问题描述 2011年3月,日本东海岸发生了地震,引发了福岛第一核电站事故,导致三个核反应堆熔毁,并在一场巨大…

MySQL部署

1、卸载mariadb rpm -qi mariadb-libs yum remove mysql-libs -y 2、查看操作系统内核版本及硬件架构 uname -a 3、查看glibc版本 ldd --version 4、下载mysql压缩包 wget https://cdn.mysql.com/archives/mysql-8.0/mysql-8.0.35-linux-glibc2.17-x86_64.tar 5、解压到/mnt目录…

[java基础揉碎]基本数据类型转换

介绍 当java程序在进行赋值或者运算时,精度小的类型自动转换为精度大的数据类型, 这个就是自动类型转换。 数据类型按精度(容量)大小排序为: 自动类型转换注意和细节 1.有多种类型的数据混合运算时,系统首先自动…

如何在浏览器上设置 VPN 网络虚拟专用网络

如何在DT浏览器上设置 VPN 网络 虚拟专用网络(VPN)是一种用公用网络架设专用网络的技术。如何在DT浏览器上设置 VPN 呢,先下载DT浏览器,建议在官方网站下载最新版,安装,在DT浏览器首页点更多,网…

Stable Diffusion中的Embeddings

什么是Embeddings? Embeddings是一种数学技术,它允许我们将复杂的数据(如文本或图像)转换为数值向量。这些向量是高维空间中的点,可以捕捉数据的关键特征和属性。在文本处理中,例如,embeddings可…

php基础学习之变量

php使用变量的必要性 PHP 是一种动态网站开发的脚本语言,动态语言特点是交互性,会有数据的传递,而 PHP作为“中间人”,需要进行数据的传递,传递的前提就是 PHP 能自己存储数据(临时存储) php变量的使用 定义&#xf…

linux系统nginx工具的访问控制

访问控制 nginx访问控制模块基于ip访问控制配置语法 基于用户的信任登录配置文件更改建立登录用户 nginx访问控制模块 基于IP的访问控制:http_access_module 基于用户的信任登录:http_auth_basic_module 两个同时只能开启一个 基于ip访问控制 配置语法 …

HTML以及CSS相关知识总结(一)

近日就开始回顾html和css相关知识啦,并且会学习html5和css3的新知识,以下是我对记忆不太深刻的地方以及新知识点的总结: Web标准: 结构:用于对网页元素进行整理和分类,即HTML 表现:用于设置网页…

使用 Node 创建 Web 服务器

Node.js 提供了 http 模块,http 模块主要用于搭建 HTTP 服务端和客户端,使用 HTTP 服务器或客户端功能必须调用 http 模块,代码如下: var http require(http); 以下是演示一个最基本的 HTTP 服务器架构(使用 8080 端口)&#x…

「最大化最小值」或者「最小化最大值」采样二分

分割数组的最大值 给定一个非负整数数组 nums 和一个整数 k ,你需要将这个数组分成 k 个非空的连续子数组。 设计一个算法使得这 k 个子数组各自和的最大值最小 思路:段数分的越多,最大值就越小,从不分段开始找,l为M…

LeetCode 第381场周赛个人题解

目录 100191. 输入单词需要的最少按键次数 I 原题链接 题目描述 思路分析 AC代码 100188. 按距离统计房屋对数目 I 原题链接 题目描述 思路分析 AC代码 100192. 输入单词需要的最少按键次数 II 原题链接 题目描述 思路分析 AC代码 100213. 按距离统计房屋对数目…

Python实现稳健线性回归模型(rlm算法)项目实战

说明:这是一个机器学习实战项目(附带数据代码文档视频讲解),如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 稳健回归可以用在任何使用最小二乘回归的情况下。在拟合最小二乘回归时,我们可能会发现一些…

python写完程序怎么运行

python有两种运行方式,一种是在python交互式命令行下运行; 另一种是使用文本编辑器直接在命令行上运行。 注:以上两种运行方式均由CPython解释器编译运行。 当然,也可以将python代码写入eclipse中,用JPython解释器运行&#xff0c…

雪花算法回拨问题解决方案

什么是时间回拨问题 雪花算法通过时间来即将作为id的区分标准之一,对于同一台id生成机器,它通过时间和序号保证id不重复当机器出现问题,时间可能回到之前,此时,时间就不能区分又或者因为闰秒的出现,导致时间回拨 如何解决 方法1 直接抛出异常 不管3X721,直接抛出异常将问题…

力扣208题:实现Tire(前缀树)

【题目链接】 力扣&#xff08;LeetCode&#xff09;官网 - 全球极客挚爱的技术成长平台 【解题代码】 public class Trie {public class TireNode {private int level; // 所在层级private boolean end; // 是否为词尾private HashMap<Character, TireNode> nextChs;…

Spring MVC的原理

Spring MVC中的MVC即模型-视图-控制器&#xff0c;该框架围绕一个DispatcherServlet设计而成&#xff0c;DispatcherServlet会把请求分发给各个处理器&#xff0c;并支持可配置的处理器映射和视图渲染等功能。Spring MVC的具体工作流程如下&#xff1a; &#xff08;1&#xff…

微服务不死 — 共享变量在策略引擎项目的落地详解

01 背景 1、共享变量的提出 前段时间&#xff0c;来自亚马逊 Prime Video 团队的一个案例研究在开发者社区中掀起了轩然大波。大体是这样一件事&#xff0c;作为一个流媒体平台&#xff0c;Prime Video每天都会向客户提供成千上万的直播流。为了确保客户无缝接收内容&#xff0…

【动态规划】【数学】【C++算法】805 数组的均值分割

作者推荐 【动态规划】【数学】【C算法】18赛车 本文涉及知识点 动态规划 数学 805 数组的均值分割 给定你一个整数数组 nums 我们要将 nums 数组中的每个元素移动到 A 数组 或者 B 数组中&#xff0c;使得 A 数组和 B 数组不为空&#xff0c;并且 average(A) average(B)…