1

我有一个需要显示指标的应用程序。应用程序需要为每个指标显示一个单独的垂直部分。当我开始这个时，只有 5 个指标，所以我天真地创建了一个包含 5 个区域的模板，一个用于我需要显示的每个指标。现在，需要添加新的指标，我想避免在模板中添加“硬编码”区域 div。我想重构它并根据一些配置数据在启动时动态创建所需的区域。

所以我一直在查看最新的 Marionette 版本，并且在“动态添加区域到 Marionette 布局”中，Derick Bailey 提到 Marionette v1.0 通过 addRegion() 支持布局中的动态区域，如：

var layout = new MyLayout();
layout.render()
layout.addRegion("someRegion", "#some-element");
layout.someRegion.show(new MyView());

我已经在我的代码中尝试过（使用 Marionette 1.0.2），但我没有让它工作。我的模板中没有 id="some-element" 的 div，我怀疑这可能是原因。我希望 Marionette 会自己创建那个 div。

也许我对动态添加区域意味着什么的期望是错误的。所以我的第一个问题是：在布局中动态添加区域时，在 addRegion() 函数中传递的元素 id 是否必须已经存在于布局中？

如果是这样，那么我又回到了必须在模板中“烧录”这些 div 以使区域也附加自己的问题。然后我的后续问题是：以数据驱动的方式执行此操作的最佳方法是什么？是否需要编写我自己的 render() 函数以便创建正确的 div 集？或者也许为我的布局提供一个模型对象，该对象将包含模板然后可以迭代以创建必要的 div 的数据？如果我们事先不知道实际需要多少个区域，我们如何动态地将区域添加到 Layout 对象？

4

2 回答 2

1

Aa @aaronfay 指定，我们需要使用 jQuery 在页面上创建元素。这是一些示例代码：

var layout = new MyLayout();
layout.render()
var regionName = "dynamicRegion"; 
layout.$el.append('<div id="'+regionName+'"></div>');
layout.addRegion("someRegion", "#"+regionName);
layout.someRegion.show(new MyView());
于 2014-07-29T21:58:48.543 回答
0

我相信您需要使用 jQuery（或类似的）在页面上创建元素。区域期望元素存在。

否则，我相信你的答案就在这里。

于 2013-06-20T17:43:23.663 回答