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

Question

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

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

Answer 1

MVVM实际上是一种子模式。那里并没有真正的“MVVM”Web应用程序框架。它们都是MVC，如果你想要的话，你几乎只需要一个视图模型。

特别是在ASP.NET MVC中，您只需创建一个类，通常使用[Model Name]ViewModel或[Model Name]VM形式的名称。该类将只包含您需要使用的模型中的属性以及任何额外的内容，这些内容对于实际的数据库支持的模型没有意义，例如SelectList s等。

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

return View(viewModelInstance);

当然，请确保您的观点接受：

@model Namespace.To.MyViewModel

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

Answer 2

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

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

根据我对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决定谁对数据执行了哪些操作，并将新视图返回给用户。

Answer 3

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

在 C ontroller中填写 M odel，然后将其传递给 V iew。

MVVM是双向数据绑定的。

填写 M odel，在 V 中使用它，当 V iew状态发生变化时， M odel自动更新。（反之亦然）

Answer 4

  

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

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

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

维基百科上的MVVM表示它是由Microsoft与WPF一起引入的。具体地说，视图绑定到视图模型上的属性。然后，视图模型将此映射到数据库。那么根据这个定义，Asp.Net并不完全匹配。像敲门（Knockout.js）和vue.js这样的客户端框架确实支持这种具有视图模型属性的2向绑定。

所有这些模式都基于出色的MV *模式。它最初被称为MVC设计模式。那么，这是与Asp.Net MVC完全相同的模式吗？其实不是。 Controller的含义与之完全不同（请参阅MVC on wikipedia）。原始的MVC控制器不通过视图直接处理所有用户输入。其次，原始的MVC模式是为桌面应用程序GUI设计的，Asp.Net MVC修改了该模式以用于客户端-服务器Web应用程序。 ASP.Net控制器是客户端html页面可以命中的http端点的集合（例如，表单发布，页面导航，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连接。

Answer 5

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

如果可以将上述路径绑定到Asp中，则可以在桌面和Web应用程序中重用所有这种模型。