在预呈现的HTML上构建Marionette视图的简洁方法是什么?

时间:2014-04-22 14:22:16

标签: javascript backbone.js marionette

我一遍又一遍地遇到这个问题而且我并不总是知道如何解决这个问题。例如,我从服务器加载页面。该页面包含一个实体列表(Backbone.Marionette.ItemViewCollectionView内的CompositeView集合。如何使用Backbone / Marionette管理的对象干净地替换预呈现的HTML拆掉最初的HTML?

问题在于我不得不等到页面加载完毕,然后构建数据视图,创建暂停,然后在页面最终真正准备就绪之前闪存。

1 个答案:

答案 0 :(得分:3)

我这样做:
- 加载预先渲染的列表,该列表位于容器中,ID为:#container
- 在id #container
上创建一个牵线木偶区域 - 在该容器中显示“marionnette-ized”视图

请参阅小提琴:http://jsfiddle.net/Cardiff/D6hXZ/

请注意,使用牵线木偶版本在5秒后更新html:

// Create a region
var rm = new Marionette.RegionManager();
rm.addRegion("container", "#container");

// Show the collectionView with a delay, replacing the pre-rendered html
_.delay(function() {
    console.log('updating list with marionette views!');
    rm.get('container').show(movieCompViewInstance);
}, 5000);

您没有看到任何闪烁,只是更改了文字颜色以表示牵线木偶版本处于活动状态。此外,在单击删除按钮之前不会执行任何操作,在加载后,它们将起作用。