Question

我们说我有一个实时聊天用户列表。用户在登录和退出我的应用程序时进入和离开列表。包含用户模型的集合不断更新，并且绑定到的视图（在我的情况下为CompositeView）反映了这一点。这很有效。

我想在列表上方提供一个单选按钮选项，允许用户查看列表的子集。我会用颜色来说明。

有些用户是红色，有些是黄色，有些是蓝色。我无法找到一个干净的解决方案来获取用户颜色选择并相应地过滤列表。列表的实时，动态性质增加的复杂性让我失望。列表永远不会解决。用户可以来去，也可以改变颜色。红色用户可以变黄，黄色用户可以变蓝等等。如果黄色滤镜打开并且Johnny从红色变为黄色，则应该弹出列表。如果一分钟后他变红了，他应该离开名单。如果将无线电选择器切换为红色，则应再次在列表中看到Johnny。

我看到的唯一解决方案是多个集合，集合的手动维护（人们更改颜色时的删除和添加）以及颜色单选按钮选择更改时重新绑定和显示视图。

我是在正确的轨道上还是有更清洁的方法来做到这一点？有没有办法用一个集合来做？

更新：按照以下帖子尝试升级到最新版本的Marionette js。升级breaking stuff。当我解决这个问题时，我会尝试回到这一点。

Answer 1

看看Marionette CollectionView.Filter：

如果要阻止某些选项，CollectionView允许自定义过滤器选项基础集合的模型被呈现为子视图。

由于CompositeView从CollectionView扩展，你应该有相同的方法。

您的过滤方法如下所示：

filter: function (child, index, collection) {
  return _.contains(this.model.get('current_colors'), child.get('color'));
}

现在您需要检测项目何时更改颜色。您可以将其基于模型更改（使用collectionEvents）或触发事件的视图。

collectionEvents: {
  "change:color": "render"
}

最后还会在单选按钮更改时触发：

modelEvents : {
  "change:current_colors" : "render"
}

（或者，只是听取单选按钮更改事件）。

其中一些会根据您当前的颜色＆＃39;而变化。保存，但我认为你明白了。

Marionette js集合子集

1 个答案: