---
description: 一种软件架构模式
---

# MVVM

MVVM 最初被发明是专门用来简化用户界面的 event-driven programming（事件驱动编程）。后来被合并到 Microsoft 的 .NET 图形系统和 Silverlight 中，并在 2005 年由开发人员在其博客上宣布了 MVVM。

Model-View-ViewModel，将 View 和 Model 分离，并引入一个 ViewModel 来充当连接两者的中介。

<img src="https://2598460105-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGNkDWo1TzHEOBRUxCRfy%2Fuploads%2F1G67KdtG2F75EC5OPEHy%2Fimage.png?alt=media&#x26;token=3359b533-162a-4177-9bb7-0ea2a7f426e5" alt="" data-size="original">

<table data-header-hidden><thead><tr><th width="134.33333333333331"></th><th width="100"></th><th></th></tr></thead><tbody><tr><td>Model</td><td>模型</td><td>数据和业务逻辑</td></tr><tr><td>View</td><td>视图</td><td>只关注数据的展示，同时接收用户的操作（鼠标/键盘/手势）并通过数据绑定将这些交互转发给 ViewModel</td></tr><tr><td>ViewModel</td><td>视图模型</td><td>它有个 binder（绑定器），通常是双向数据绑定。即当 Model 发生变化时，ViewModel 会自动更新 View，反之亦然。这使得用户界面与数据保持同步。通常包括业务逻辑、数据处理。</td></tr><tr><td></td><td></td><td>Model-View-ViewModel 也称 Model-View-Binder</td></tr></tbody></table>

ViewModel 是一个 value converter（值转换器），它比 View 更具有模型性，并处理 View 的大部分显示逻辑。ViewModel 可以实现 Mediator Pattern（中介者模式）。

比如，在 Vue 中，数据对象充当 Model，Vue 模板充当 View，Vue 实例充当 ViewModel。
