Question

我无法渲染Marionette LayoutView并在该布局中显示区域。

我的布局文件：

template: '#fooTemplate',
    regions: {
        barRegion: '.bar'
    }

我的HTML：

<script id="fooTemplate" type="text/template">
    <div id="fooDiv">
        <div class="bar">
        </div>
    </div>          
</script>

呈现布局并显示区域的代码：

var FooLayout = require('./browserify/path');
var fooLayout = new FooLayout({el:"#fooDiv"})

collectionView = new CollectionView({
    collection: collection
});
fooLayout.render();
fooLayout.barRegion.show(collectionView);

我收到错误未捕获错误：＆＃34; el＆＃34; #foo .bar必须存在于DOM

中

LayoutView的功能中缺少什么？我有一个类似的例子工作正常，但由于某种原因我不能复制它。

Answer 1

这是因为视图与DOM分离。如果指定{el:"#fooDiv"}，则#fooDiv元素必须在DOM中。我认为应该是这样的：

<script id="fooTemplate" type="text/template">
    <div class="bar"></div>      
</script>

在html标记中添加#fooDiv

<body>
    ...
    <div id="fooDiv"></div>
    ...
</body>

然后你可以做

// "wrap" new Layout around existing div
new FooLayout({ el: '#fooDiv' });
// etc.

或

// create a new DOM element with the id 'fooDiv':
var fooLayout = new FooLayout({ id: 'fooDiv' });
fooLayout.render();
document.body.appendChild(fooLayout.el); // or $('body').append(fooLayout.el);

Backbone Marionette LayoutView找不到DOM元素

1 个答案: