MVVM 在 ASP.NET MVC 4 Web 应用程序中扮演什么角色？答案

【问题标题】：What role does MVVM play in ASP.NET MVC 4 web applications?MVVM 在 ASP.NET MVC 4 Web 应用程序中扮演什么角色？
【发布时间】：2013-05-29 12:58:14
【问题描述】：

在阅读“ASP.NET MVC 4”一书时，我想知道 MVVM。我开始在谷歌上搜索，找不到任何关于使用 MVVM 开发 Web 应用程序的书籍，所以我一定在这里遗漏了一些信息。

据我了解，MVVM 通过 knockout.js 和其他框架在客户端的 Web 应用程序中使用。然而，如果我要开发一个 Windows Phone 应用程序，我可以直接使用 MVVM 而不使用 MVC。这是否意味着，MVVM / 数据绑定的概念不适用于客户端-服务器 Web 应用程序？

【问题讨论】：

你可能还想看看 google 的 Angular 框架，它比淘汰赛更好

标签： asp.net-mvc web-applications mvvm knockout.js

【解决方案1】：

MVVM 确实是一种子模式。那里没有真正的“MVVM”网络应用程序框架。它们都是 MVC，如果需要，您几乎只需合并一个视图模型。

特别是使用 ASP.NET MVC，您只需创建一个类，其名称通常采用 [Model Name]ViewModel 或 [Model Name]VM 的形式。该类将仅包含您需要使用的模型中的属性以及任何其他对您的实际数据库支持的模型没有意义的东西，例如SelectLists 等。

在您的操作中，您只需将此视图模型的一个实例传递给您的视图，而不是您的模型：

return View(viewModelInstance);

当然，请确保您的视图接受：

@model Namespace.To.MyViewModel

唯一稍微复杂的部分是将视图模型连接到模型（即，从视图模型/模型获取数据/从视图模型/模型获取数据。您可以通过显式映射属性手动完成此操作，或者您可以使用类似AutoMapper .

【讨论】：

Angular by google ，淘汰赛是基于 jquery 构建的 MVVM 框架
抱歉，我应该更具体一些。我的意思是 Web 应用程序框架。我不知道有任何纯 MVVM Web 堆栈。

【解决方案2】：

MVVM 是 WPF/Silverlight 开发的标准设计模式，不应与用于 ASP.Net 开发的 MVC 混淆。

两者可能听起来很相似，并且有一些共同的部分，但它们是两种不同的设计模式。

根据我对 knockout.js 的了解，它旨在创建类似于您在 WPF/Silverlight 开发中使用的“数据绑定”，这就是 MVVM 设计模式适用于此的原因。

引用我的另一个 answer 关于 MVVM 和 MVC 之间的差异

在 MVVM 中，您的代码类 (ViewModels) 是您的应用程序，而您的 Views 只是一个非常用户友好的界面，位于应用程序代码之上，允许用户与之互动。这意味着ViewModels 的工作量很大，因为他们是您的应用程序，负责从应用程序流程到业务逻辑的所有事情。

使用 MVC，您的 Views 是您的应用程序，而您的 Controller 处理应用程序流。应用程序逻辑通常在ViewModels 中找到，它们被认为是 MVC 中 M 的一部分（旁注：MVC 中的 M 不能被认为与 MVVM 中的 M 相同，因为 MVC 的 M 层比 MVVM 的 M 层包含更多功能）。给用户一个屏幕 (View)，他们与之交互，然后向Controller 提交一些内容，Controller 决定谁处理数据并将新视图返回给用户。

【讨论】：

我发现“另一个答案”中的引用非常简单，并且可以说是不准确的。该引用中的“应用程序”暗示业务逻辑，如果是这样，您不会将业务逻辑放在 MVVM 中的 VM 中，也不要将 M 放在 MVC 中。作者完全错过了 MVVM 中 V 的全部要点，您通常会限制代码隐藏的数量，因此它们几乎不是“非常用户友好的界面”。 VM 的工作量不大。如前所述，您限制了放置在那里的业务逻辑数量
"应用程序逻辑通常存在于 ViewModels 中，它们被认为是 MVC 中 M 的一部分"这是怎么回事？ MVC 中的 M 仅包含模型（通常是 POCO 类），我认为应用程序逻辑在控制器中？如果我错了，请纠正我。
@zeppelin 也许事情已经发生了变化，但是几年前，当我阅读 MVC 教程并查看 VS 中的 MVC 模板时，我似乎想起了 Models 文件夹中名为“ViewModel”的类。它们实际上并不是与 MVVM ViewModels 相同意义上的 ViewModels。两个对象都为 View 提供数据，但 MVVM ViewModels 经常做很多在 MVC 控制器中可以找到的工作。
美妙的 MVVC 模式已被几乎所有平台采用。 Android 开发使用它和 Xamarin Forms 和 WPF 尤其是视图非常强大。您加入后不再需要担心状态.. 就像您可以将进度条直接绑定到循环计数器或购物车总数而忘记它。

【解决方案3】：

MVC 是一种单向数据绑定系统。

在 Controller 中填写您的 Model，然后将其传递给 View。

MVVM 是一种双向数据绑定。

填写你的Model，在View中使用它，当View状态改变时，你的M模型自动更新。（反之亦然）

【讨论】：

【解决方案4】：

这是否意味着 MVVM / 数据绑定的概念不适用于客户端-服务器 Web 应用程序？

不，您可以将 MVVM 模式应用于客户端-服务器 Web 应用程序。

事实上，Asp.Net MVC 确实使用了这种模式——当控制器创建视图时，它可以传入一个“视图模型”。此视图模型通常是一个 POCO 数据对象，其中包含特定视图所需的所有数据，从模型（数据库）中提取。视图使用这些数据来呈现 html 页面。

维基百科上的 MVVM 说它是由 Microsoft 通过 WPF 引入的。具体来说，视图绑定到视图模型上的属性。然后视图模型将其映射到数据库。根据这个定义，Asp.Net 并不完全匹配。像 knockout.js 和 vue.js 这样的客户端框架确实支持这种带有视图模型属性的 2-way 绑定。

所有这些模式都基于奇妙的 MV* 模式。它最初被称为 MVC 设计模式。那么这是与 Asp.Net MVC 完全相同的模式吗？其实，也不全。控制器意味着开始时完全不同的东西（请参阅MVC on wikipedia）。原始的 MVC 控制器直接处理所有用户输入，而不是通过视图。其次，最初的 MVC 模式是为桌面应用程序 GUI 设计的，Asp.Net MVC 调整了该模式以用于客户端-服务器 Web 应用程序。 ASP.Net 控制器是客户端 html 页面可以访问的 http 端点的集合（例如 form-post、page-navigation、ajax）。

所以有很多 M-something-V 模式，一般模式通常被称为 MVC 设计模式。

还有一个更重要的问题：客户端与服务器端。我们已经引入了丰富的客户端 JavaScript 框架，而奇妙的 MV* 模式在这里也很棒。所以现在我们可以有类似的东西：客户端 View-Model-ServerHTTPEndPoints 和服务器端 ServerHTTPEndPoints-ServerModel。服务器端点是指 Asp.Net 控制器或您使用的任何 Web 框架或编程语言中的等效物。从服务器端的角度来看，整个客户端的 html 就是视图。客户端模型与服务器 ajax api（http 端点）对话以同步数据或触发高级操作。 ServerModel 通常是一个数据库。在淘汰赛/vue 中，它将是 ViewModel，而不是客户端“模型”。如果您将 react/vue 与 redux/flux 一起使用，那么客户端将是 View-ViewModel-Model-ServerHTTPEndPoints，其中模型将是 redux/flux 存储。此外，通常在服务器端引入一个服务：ServerHTTPEndPoints-Service-Model。这样，单元测试可以直接访问服务，而不是启动整个 Web 服务器并建立 HTTP 连接。

【讨论】：

【解决方案5】：

我在桌面应用程序中使用了 MVVM，并且在我的视图模型中有一个名为 Model 的属性，我将业务对象存储为模型。我的视图有一个名为 DataContext 的属性，视图模型在加载视图之前存储在其中。视图使用路径 DataContext.Model.BusObjPropertyName 将其控件绑定到业务对象。我有一个 UserInteractionService 从一开始就注册视图和视图模型之间的关系。当一个视图模型需要展示另一个视图模型时，它会调用 UserInteractionService 中的 ShowView 方法并将视图模型作为参数传递。然后服务实例化与接收到的视图模型对应的视图，将其 DataContext 属性设置为视图模型并显示它。

如果可以在 Asp 中对上述路径进行绑定，则所有这些模型都可以在桌面和 Web 应用程序中重用。

【讨论】：