3

我需要显示/编辑的数据似乎与 Marionette 提供的内置视图不匹配。让我举一个例子来说明。

假设我想列出/编辑书籍。每本书都有一个 ISBN、一个标题和 0 个或多个标签。基本上,信息的显示将是表格的(标签下的每个单词都是一个单独的标签,可以单独编辑/删除):

+---------+----------------+-----------------------------+
|ISBN     |Title           |Tags                         |
+=========+================+=============================+
|12345678 |My Last Summer  |vacation diary kids          |
+---------+----------------+-----------------------------+
|12354389 |The Day After   |fiction future               |
+---------+----------------+-----------------------------+

如果每本书只有一个标签,那么 CompositeView/ItemView 会很好地工作。我在想的是在每行的最后一个单元格中动态创建区域,然后使用 CompositeView/ItemView 来处理标签列表。也许这是矫枉过正,在模板中有某种迭代器是要走的路。

我考虑过捕获标签并使用特定书籍的标签列表填充单个字符串。我可以通过处理从后端接收到的数据来做到这一点,从而将标签列表制作成单个数据元素,这样我就可以使用 CompositeView/ItemView 将其作为一个简单的表来处理。这确实引入了额外的“映射”,实现“编辑”视图会变得更加复杂。

所以我只是希望听到人们是否遇到了这种要求,以及哪些方法可以很好地与 Marionette 配合使用。谢谢。

4

1 回答 1

5

正如您已经发现的那样,您可以通过多种不同的方式来完成这项工作。每个选项都将更适合一组特定的情况,但也有可能您的情况没有“最佳”方式来完成您想要的。如果是这种情况,只需选择一个并继续前进。:)

将标签映射到单个值

这是你已经建议的。它适用于标签数量相对较少的情况,并且当有人点击特定标签时您不需要采取任何自定义操作。例如,如果您只是将每个标签设置为一个<a href="#{tag-name}">链接,您可以轻松地将标签映射到一个简单的数组。

迭代模板中的标签集合

与映射选项基本相同,除了不是将标签缩减为简单的字符串数组,您将模板中的标签集合作为模型进行迭代,并调用 model.get(...) 以获取数据你需要。

如果您使用像 Handlebars 这样的模板引擎,这将变得非常容易,并且可能通过使用子模板产生更清晰的结果。

不过,我可能不会将这种方法推荐给下划线模板,因为它们在进行迭代时往往会很快变得混乱和丑陋。

CllectionViews 的 CollectionView,使用布局

这是更复杂的选择,但也是最有能力的。

itemView将藏书配置为布局。布局中将有一个区域,并且该区域将填充另一个集合视图以呈现每个单独的标签。

这样做的好处是您可以拥有更多与正在呈现的单个标签相关联的代码和功能。每个标签都有一个视图实例,这意味着更容易封装和组织代码。

缺点是每个标签都有一个视图实例,并且需要编写更多代码来设置和运行它。

CompositeViews 的 CollectionView

复合视图允许您围绕集合呈现包装模板,这可能证明是优于 CollectionView 的优势。

你仍然需要一个 CollectionView。此 CollectionView 将按原样呈现 CompositeView itemView。CompositeView 将指定一个itemViewContainer来呈现标签的集合。每个标签仍然有自己的视图实例。

您可以通过这种方式摆脱布局和区域。视觉结果与使用带有布局的 CollectionView 相同,但执行此操作的代码量可能会大大减少。


就个人而言,我要么执行 map/reduce 以将标签简化为一个简单的数组,要么使用 CompositeViews 的 CollectionView。

于 2012-11-02T13:25:55.700 回答