- MVVM 是 Vue 实现数据驱动视图和双向数据绑定的核心原理。
- 在 MVVM 模型中,主要由如下三部分组成:
- M:Model,模型,也就是要渲染到视图 View 上的数据
- V:View,视图,数据渲染的位置
- VM:ViewModel,视图模型,可以视为 Model 和 View 之间建立关系的桥梁,VM 是 MVVM 的核心,VM 将要渲染到视图上的数据 Model 和数据渲染的位置 View 联系在了一起
- MVVM 模型实现了视图 View 和数据 Model 之间的解耦
- 以 Vue 为例说明 MVVM 的工作原理:
- 在 Vue 中,Vue 实例对象扮演的角色就是 MVVM 中的 VM,Vue 实例对象将 Model 中的数据通过数据绑定的方式渲染到视图 View 中,当数据源 Model 发生变化时,Vue 实例对象会触发对视图 View 的更新;同时,Vue 实例对象也会监听视图中的变化,当视图中与 Model 相关的数据值发生了修改,Vue 实例对象能够监听到此次变化,从而触发数据源 Model 中数据的同步


Vue MVVM 模型
萤火虫的小尾巴2023-08-24 21:46
相关推荐
杨先生哦5 小时前
2026 热端攻防:AI 驱动 Web 前端安全全景透析李白的天不白6 小时前
SmartAdmin(基于 Spring Boot 框架)中配置跨域请求 VUE3 设置请求头一个被程序员耽误的厨师6 小时前
01-设计篇-我用前端那一套手艺造了一个AI-Native工具不吃糖葫芦36 小时前
vue3实现拓扑图编辑功能(谨以此纪念我当前的最后一份前端工作)大家的林语冰6 小时前
超越 TypeScript,Flow 强势回归,语法高仿 TS,功能更丰富,类型更安全!星空6 小时前
html\css\js入门重生之我是Java开发战士6 小时前
【Java SE】多线程(三):单例模式,阻塞队列,线程池与定时器lijgvnns6 小时前
个人AI编程工具的vibe coding实践:从爬虫到导出Excel的全流程এ慕ོ冬℘゜6 小时前
jQuery 高可用多图上传组件(企业级封装 + 踩坑全解 + 可直接上线)