当前位置: 首页 > news >正文

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

http://www.lryc.cn/news/103259.html

相关文章:

  • 【数据结构与算法】归并排序
  • OSG3.6.5 + VS2017前期准备及编译
  • IPv6 over IPv4隧道配置举例
  • 【GitOps系列】使用 ArgoCD 快速打造GitOps工作流
  • C#|无法打开cs文件设计窗口
  • 【SpringBoot笔记36】SpringBoot自定义WebSocketHandler集成WebSocket
  • flutter 图片相关
  • 将上位机程序从PC的window系统迁移至Intel NUC的无桌面版ubuntu系统问题记录
  • CHI中的error处理
  • 如何使用 PHP 进行数据库缓存处理?
  • 新版巨量广告投放技巧分析
  • Vue3 导出excel
  • vue 使用vue-json-viewer 展示 JSON 格式的数据
  • 14.python设计模式【模板方法模式】
  • 谷粒商城第六天-实现功能的前序工作(网关的配置 跨域配置)
  • 为什么说国内数字孪生平台gis架构采用Cesium是不错的选择?
  • 前端面试的性能优化部分(1)每篇10题
  • GitLab备份升级
  • Matlab实现遗传算法仿真(附上40个仿真源码)
  • git使用(由浅到深)
  • NAT协议(网络地址转换协议)详解
  • pytorch(续周报(1))
  • el-table 树形结构数据 设置某一层,新增按钮不展示
  • 【Unity2D】粒子特效
  • 第九十六回 网络综合示例:获取天气信息
  • Shell中获取昨天和多天前日期
  • golang静态编译及编译失败排查步骤
  • 2023年7月第4周大模型荟萃
  • Meta分析的选题与文献计量分析CiteSpace应用丨R语言Meta分析【数据清洗、精美作图、回归分析、诊断分析、不确定性及贝叶斯应用】
  • vscode eslint配置