MVC与MVVM模式的区别

一、MVC

Model(模型):用于处理应用程序数据逻辑,负责在数据库中存取数据。处理数据的crud

View(视图):处理数据显示的部分。通常视图是依据模型数据创建的。

Controller(控制器):处理数据显示的部分,控制器负责从视图读取数据,控制用户输入,并将数据发送给模型。一般包括业务处理模块和router路由模块

 

二、  M VVM——视图模型双向绑定

Model:模型层:用于处理业务逻辑和与服务器端进行交互

View:视图层:用于将数据模型转化为UI展示出来,简单来说就是html页面

ViewModel:视图模型层:框架封装的核心,它负责将数据与视图关联起来

  • Model 和 View 并无直接关联,而是通过 ViewModel 来进行交互的(即双向数据绑定),
  • Model 和 ViewModel之间有着双向数据绑定的联系

 三、区别

MVVM 与 MVC 最大的区别就是:

MVVM实现了View和Model的自动同步,当Model属性改变时,不用手动操作Dom元素去改变View的显示。而改变属性后,该属性对应View的显示会自动改变

四、延伸:

 阐述一下你所理解的MVVM响应式原理

  • vue是采用数据劫持配合发布者-订阅者的模式的方式,
    • 通过Object.defineProperty()来劫持各个属性的getter和setter
    • 在数据变动时,发布消息给依赖收集器(dep中的subs),去通知(notify)观察者,做出对应的回调函数,更新视图
  • MVVM作为绑定的入口,整合Observer,Compile和Watcher三者,
    • 通过Observer来监听model数据变化,
    • 通过Compile来解析编译模板指令,
    • 最终利用Watcher搭起Observer,Compile之间的通信桥路,
    • 达到数据变化Observer)=>视图更新视图交互变化=>数据model变更的双向绑定效果。

 

 参考:https://juejin.cn/post/7110885291946147876

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

25.6 matlab里面的10中优化方法介绍—— 遗传算法(matlab程序)

1.简述 遗传算法(Genetic Algorithm, GA)是模拟达尔文生物进化论的自然选择和遗传学机理的生物进化过程的计算模型,是一种通过模拟自然进化过程搜索最优解(所找到的解是全局最优解)的方法。 参数编码、初始群体的设定…

Generative Diffusion Prior for Unified Image Restoration and Enhancement 论文阅读笔记

这是CVPR2023的一篇用diffusion先验做图像修复和图像增强的论文 之前有一篇工作做了diffusion先验(Bahjat Kawar, Michael Elad, Stefano Ermon, and Jiaming Song, “Denoising diffusion restoration models,” arXiv preprint arXiv:2201.11793, 2022. 2, 4, 6,…

【万字长文】SpringBoot整合SpringSecurity+JWT+Redis完整教程(提供Gitee源码)

前言:最近在学习SpringSecurity的过程中,参考了很多网上的教程,同时也参考了一些目前主流的开源框架,于是结合自己的思路写了一个SpringBoot整合SpringSecurityJWTRedis完整的项目,从0到1写完感觉还是收获到不少的&…

前端,js , Error in created hook: TypeError ,有bug了

怎么兄弟,遇到bug了???你开心吗,哈哈哈哈

论文笔记--Skip-Thought Vectors

论文笔记--Skip-Thought Vectors 1. 文章简介2. 文章概括3 文章重点技术3.1 Skip Thought Vectors3.2 词表拓展 4. 文章亮点5. 原文传送门6. References 1. 文章简介 标题:Skip-Thought Vectors作者:Ryan Kiros, Yukun Zhu, Ruslan Salakhutdinov, Rich…

7.28 作业 QT

手动完成服务器的实现&#xff0c;并具体程序要注释清楚: widget.h: #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QTcpServer> //服务器类 #include <QTcpSocket> //客户端类 #include <QMessageBox> //对话框类 #include …

乐划锁屏充分发挥强创新能力,打造内容业新生态

乐划锁屏作为新型内容媒体,在这一市场有着众多独特的优势,不仅能够通过多场景的联动给内容创作者带来了更多可能性,还促进了更多优质作品的诞生,为用户带来更加丰富多彩的锁屏使用体验。 作为OPPO系统原生的OS应用,乐划锁屏一直致力于打造为用户提供至美内容的内容平台,吸引了全…

ETHERNET/IP转RS485/RS232网关什么是EtherNet/IP?

网络数据传输遇到的协议不同、数据互通麻烦等问题&#xff0c;一直困扰着大家。然而&#xff0c;现在有一种神器——捷米JM-EIP-RS485/232&#xff0c;它将ETHERNET/IP网络和RS485/RS232总线连接在一起&#xff0c;让数据传输更加便捷高效。 那么&#xff0c;它是如何实现这一功…

解决 tensorflow 出现的 ImportError: Could not find the DLL(s) ‘msvcp140_1.dll‘. 问题

在安装完tensorflow库后出现 问题详述&#xff1a; ImportError: Could not find the DLL(s) msvcp140_1.dll. TensorFlow requires that these DLLs be installed in a directory that is named in your %PATH% environment variable. You may install these DLLs by downlo…

FS32K144官方提供串口Bootloader对接Matlab串口烧写程序

​​​​​​​ ​​​​​​​ ​​​​​​​ ​​​​​​​ ​​​​​​​ ​​​​​​​ ​​​​​​​ 前言 Bootloader升级工具&#xff1a;可用TTL、232、485&#xff08;硬件收发模式&#xff09;,其中的一种&#x…

K8s-资源管理(二)

文章目录 2. 资源管理2.1 资源管理介绍2.2 YAML语言介绍2.3 资源管理方式2.3.1 命令式对象管理2.3.2 命令式对象配置2.3.3 声明式对象配置 2.4. 模拟使用普通用户来操作2.5 kubectl 一些基本命令2.6 使用个人的 docker 仓库的镜像 2. 资源管理 2.1 资源管理介绍 在kubernetes…

JMM是如何保证原子性呢?

3.3.1加锁 锁是一种通用技术&#xff0c;比如Java提供的Synchronized关键字就是锁的一种实现&#xff0c;Synchronized是排他锁/独占锁&#xff0c;就是有你没我的意思&#xff0c;只要其他线程到来访问&#xff0c;发现锁还未释放&#xff0c;就要在外面等待&#xff0c;因为S…

linux系统下(centos7.9)安装Jenkins全流程

一、卸载历史版本 # rpm卸载 rpm -e jenkins# 检查是否卸载成功 rpm -ql jenkins# 彻底删除残留文件 find / -iname jenkins | xargs -n 1000 rm -rf二、环境依赖安装 yum -y install epel-releaseyum -y install daemonize三、安装Jenkins Jenkins官网传送带&#xff1a; …

Nginx配置WebSocket反向代理

1、WebSocket协议 ​ WebSocket协议相比较于HTTP协议成功握手后可以多次进行通讯&#xff0c;直到连接被关闭。但是WebSocket中的握手和HTTP中的握手兼容&#xff0c;它使用HTTP中的Upgrade协议头将连接从HTTP升级到WebSocket。这使得WebSocket程序可以更容易的使用现已存在的…

微服务入门---SpringCloud(一)

微服务入门---SpringCloud&#xff08;一&#xff09; 1.认识微服务1.0.学习目标1.1.单体架构1.2.分布式架构1.3.微服务1.4.SpringCloud1.5.总结 2.服务拆分和远程调用2.1.服务拆分原则2.2.服务拆分示例2.2.1.导入Sql语句2.2.2.导入demo工程 2.3.实现远程调用案例2.3.1.案例需求…

【Koa】[NoSQL] Koa中相关介绍和使用Redis MongoDB增删改查

目录 NoSQL非关系型数据库关系型数据库&#xff08;RMDB&#xff09;介绍非关系型数据库&#xff08;NoSQL&#xff09;介绍Redis & MongoDB 在 Koa 中使用 Redis (了解)Redis 的安装和使用在 Koa 中连接 和 调用 Redis 在 Koa 中使用 MongoDBMongoDB 的安装MongoShell 操作…

【Spring框架】SpringBoot配置文件

目录 配置文件作用application.properties中午乱码问题&#xff1a;配置文件里面的配置类型分类SpringBoot热部署properties基本语法properties配置文件的优缺点&#xff1a;yml配置文件说明yml基本语法配置对象properties VS yml 配置文件作用 整个项⽬中所有重要的数据都是在…

SQL-每日一题【1068. 产品销售分析 I】

题目 销售表 Sales&#xff1a; 产品表 Product&#xff1a; 写一条SQL 查询语句获取 Sales 表中所有产品对应的 产品名称 product_name 以及该产品的所有 售卖年份 year 和 价格 price 。 查询结果中的顺序无特定要求。 查询结果格式示例如下&#xff1a; 解题思路 1.题目要…

ERROR 1064 - You have an error in your SQL syntax;

ERROR 1064 - You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near (/, 少个逗号吧&#xff0c;以前开始写SQL&#xff0c;特别是修改SQL的时候容易出现这样错误。 而且自己也知道在附近…

Qt6.5.2+WebRTC学习笔记(十三)开发环境搭建(macOS13.5)

前言 在ubuntu和win10开发测试一段时间了&#xff0c;但总在存在平台特性的问题&#xff0c;所以准备将程序移植到macOS上测试&#xff0c;同步进行三个主要桌面系统开发&#xff0c;本教程记录下环境搭建过程 一、准备 1.操作系统macOS13.5 64位 x86架构&#xff08;建议系…