'型号'和'ViewModel'在Knockout.js中

'Model' and 'ViewModel' in Knockout.js

本文关键字：js Knockout 型号 ViewModel      更新时间：2023-09-26

在MVC中，'Model'只是数据的代码表示（例如，在ASP.NET MVC中，它是一个具有相应字段的类）。

然而，在Knockout（使用MVVM）中，我看到带有字段的对象被称为"ViewModel"。来自官方KO文件：

模型：应用程序存储的数据。此数据表示对象以及您的业务领域中的运营（例如，可以执行货币转账）并且独立于任何UI。当使用KO时，您通常会对一些服务器端代码进行Ajax调用，以读取并写入这个存储的模型数据。

视图模型：上的数据和操作的纯代码表示UI。例如，如果您正在实现一个列表编辑器，那么您的视图模型将是一个包含项目列表并公开方法的对象以添加和删除项目。

从示例中可以看出，ViewModels是带有字段的对象，保存数据，这通常是MVC中的Model所做的：

var myViewModel = {
    personName: ko.observable('Bob'),
    personAge: ko.observable(123)
};

所以我在这里有点迷路了。"Model"answers"ViewModel"在Knockout.js域中究竟是什么意思？

在JavaScript实现的MVVM模式中，"模型"部分通常由web api提供。提供给页面的数据就是模型。现在，一旦数据在JavaScript中，它是否包含在一个单独的模型对象中，那就另当别论了。

视图模型通常只是一个添加了属性和函数的模型，以支持应用它的特定视图。客户端计算、下拉查找值、客户端验证例程等。在这种情况下，视图模型可能如下所示：

var vm = {
    save: function(){ save logic... },
    cancel: function(){ cancel logic... },
    states: ko.observable(), //list of states for state dropdown
    customerId: ko.observable(),
    customerFirstName: ko.observable(),
    customerLastName: ko.observable()
};

其他时候，模型将在一个单独的对象中维护。在这种情况下，视图模型可能看起来像这样：

var customerModel = getCustomerFromDataSource();
var vm = {
    save: function(){ save logic... },
    cancel: function(){ cancel logic... },
    states: ko.observable(), //list of states for state dropdown
    customer: customerModel
};

需要记住的主要一点是，模型是数据，视图模型是使模型可用于视图的层（通常通过数据绑定）。有时模型可能是一个单独的类；其他时候，模型只是视图模型中的一组已知属性。

模型
模型保存信息，但通常不处理行为

查看
视图包含需要了解模型和ViewModel的数据绑定、事件和行为。尽管这些行为可以映射到属性，但View仍然负责处理ViewModel的事件

ViewModel
ViewModel位于我们的UI层后面。它公开了视图（来自模型）所需的数据，并且可以被视为视图用于数据和操作的源。

您可以在以下链接中找到更多信息在这里
您还可以在stackoverflow问题中找到有关mvc和mvvm的更多信息

相关文章：