javascript - KnockoutJS，批量更新observableArray？

Question

我有以下情况:

除了内容/标题等之外，由 observableArray 表示的项目列表。我想让它们在 View 中可折叠。

现在的问题是，我是否应该将此状态存储为每个项目的可观察对象:如果是这样，我如何实现一个触发器来有效地切换所有项目的打开/关闭 - 即。最小化 dom 更新。

ko.utils.arrayForEach 似乎是可行的方法，它是否仅在循环结束时触发 View 刷新？有更好的办法吗？

ko.utils.arrayForEach(this.items(), function(item) {
    ...
    item.close(true);
    ...
});

编辑:这就是 DOM 中发生的情况(在 knockout foreach 循环内)

<div class="item">
    <!-- ko 'if': !close() -->
    <div class="article" data-bind="html: article"></div>
    <!-- /ko -->
</div>

所以基本上我可以单击此页面上某处的按钮，该按钮运行 ko.utils.arrayForEach 来切换所有项目。它有效，我只是不知道这是否是最好的方法(例如，仅触发 dom 更新一次，而不是针对每个项目)。

Answer 1

在我看来，您需要实现过滤。根据您的数组创建新的过滤数组，并根据您的属性显示项目。

vm.filteredItems = ko.computed(function () {
    return ko.utils.arrayFilter(this.items(), function (fitem) {
        if ('open' == fitem.state()) {
            return true;
        }
        return false;
    });
}, vm);

在适当的事件中为每个项目更改 state 属性，并将 filteredItems 绑定(bind)到列表控件。

查看next example了解更多详情