何时在 Knockout.js 中创建新视图模型答案

【问题标题】：When to create new view models in Knockout.js何时在 Knockout.js 中创建新视图模型
【发布时间】：2015-09-19 21:20:26
【问题描述】：

我发现在 knockout.js 中谈论多个视图模型时通常会有些混淆

ko 文档并没有真正解释如何处理多个视图模型、如何在它们之间进行通信或何时应该考虑它们。

我发现this site 解释了创建多个视图模型的不同方法以及如何与它们交互。

我试了一下，我用不同的子模型创建了一个主模型：

var MasterModel = function(){
    this.orders = new ordersViewModel(),
    this.dates = new datesViewModel(),
    this.equipment = new equipmentViewModel();
};

在那之后，我发现自己不得不在很多地方使用with: nameOfModel（并为其创建额外的包装器或HTML cmets），甚至只使用视图模型的名称作为前缀data-bind="foreach: orders.getList()"。

除此之外，还有它们之间的通信问题，虽然可以通过某种方式解决，但似乎不像处理单个视图模型那么简单。

我的问题是，是否值得创建多个视图模型？如果是，什么时候？似乎它只会增加更多的困难，而我最终并没有看到它的优势。（是的，他们说它保持模块化......但我最终没有看到明显的优势）

【问题讨论】：

标签： knockout.js knockout-3.0 knockout-3.2

【解决方案1】：

我同意 Anish Patel 的观点，这取决于它，它是关于关注点分离和使您的类保持单一职责原则（每个类只做一件事，我发现很难用视图模型做这件事）。您可能还需要考虑让您的视图模型可以使用 Jasmine 或其他 JS 测试框架进行测试。

在我看来，在 HTML 中使用 with: 并不是一个坏方法。

RequireJs 可以帮助实现模块化并使依赖项正常工作。

ko.postbox 允许您在视图模型之间进行发布/订阅通信，而无需将它们耦合在一起。这是在您提到的链接中。您还可以通过在视图模型中传递回调函数来进行通信。

Durandal 是个好建议。我也对 Durandal 的创建者 Rob Eisenberg 的Aurelia 感兴趣，但截至 2015 年 7 月 2 日它仍处于测试阶段。这将使用标准化的 SystemJ 加载模块，并且应该使模块化视图模型更容易做到。

【讨论】：

我还是不太明白为什么你说 Aurelia 或 Durandal 可以帮助你更好地组织模块。
@Alvaro 我在考虑 Auerlia 的依赖注入和加载系统，它比必须引入不同的部分（KO、RequireJs 等）更加集成。两者都有优势，编写好的模块化代码是开发人员的责任，但有时框架可以让事情变得更容易。 Aurelia 的例子似乎也是很好的指导，尽管到目前为止我只是略过 Aurelia 的表面。

【解决方案2】：

对于应该使用多少个视图模型或者是否应该使用一个包罗万象的视图模型，没有硬性规定。

这一切都取决于您正在构建的应用程序的复杂性，以及您是否想要封装和模块化一些功能以便重用或只是保持理智。

如果您发现自己构建了一个复杂的应用程序，那么您可能会发现将应用程序模块化为单独的视图模型更易于管理和进一步更改。

在那之后，我发现自己不得不在许多地方使用 with:nameOfModel（并为其创建额外的包装器或 HTML cmets），甚至只是使用视图模型的名称作为前缀 data-bind="foreach: orders.getList ()”。

我使用了一个名为DurandalJS 的框架，它促进了模块化和组合。它还提供了一些很棒的功能，例如路由和消息传递。 DurandalJS 的组合可以帮助您减少 with: 绑定的数量，因为它使用 ko.applyBindings 将视图模型和视图绑定到页面上的元素。

【讨论】：