Vue MVVM 模型

文章归档于:https://www.yuque.com/u27599042/front-end


  • 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 中数据的同步
相关推荐
摆烂工程师10 分钟前
2025年12月最新的 Google AI One Pro 1年会员教育认证通关指南
前端·后端·ai编程
Gavin在路上16 分钟前
DDD之用事件风暴重构“电商订单履约”(11)
java·前端·重构
我命由我1234523 分钟前
VSCode - VSCode 颜色值快速转换
前端·ide·vscode·前端框架·编辑器·html·js
qq_124987075335 分钟前
基于SpringBoot+vue的小黄蜂外卖平台(源码+论文+部署+安装)
java·开发语言·vue.js·spring boot·后端·mysql·毕业设计
前端涂涂36 分钟前
怎么设计一个加密货币 谁有权利发行数字货币 怎么防止double spending attack 怎么验证交易合法性 铸币交易..
前端
JuneTT37 分钟前
【JS】使用内连配置强制引入图片为base64
前端·javascript
前端涂涂42 分钟前
4.BTC-协议
前端
老前端的功夫1 小时前
移动端兼容性深度解析:从像素到交互的全方位解决方案
前端·前端框架·node.js·交互·css3
代码与野兽1 小时前
AI交易,怎么让LLM自己挑选数据源?
前端·javascript·后端
CC码码1 小时前
前端文本分割工具,“他”来了
前端·javascript·程序员