0

在我的 index.html 中,我有空<body>标签。我有一个加载视图内容的视图(通过 icanhaz)。我想要一个全局区域(绑定到 body 标签)并通过视图将一些内容放入其中。我遇到的问题是它将整个新的正文标签放入现有的正文标签中。

这是应用程序:

var Application = new Marionette.Application();

Application.addRegions({
  bodyRegion: new Marionette.Region({el: "body"})
});

Application.addInitializer(function(options) {
    Application.bodyRegion.show(new RootView());
});

这是我的根视图:

Backbone.View.extend({
    tagName: 'body',

    initialize: function(options) {
        logger.init('root');
        loader.loadTemplate(template);
        this.headerView = new HeaderView();
        this.usersView = new UsersView();
    },

    render: function() {
        logger.render('root');
        this.$el.html(ich.rootTemplate);
        this.headerView.setElement(this.$el.find('#header')).render();
        this.usersView.setElement(this.$el.find('#main')).render();
        return this;
    }
});

这是我的 root.ich:

<script id="rootTemplate" type="text/html">
    <div id="header"></div>
    <div class="container" id="main"></div>
</script>

我遇到的问题是在渲染后我在另一个标签内有一个标签。如果我不使用 Marionette 而是使用普通的主干视图,请使用以下几行:

var rootView = new RootView();
rootView.setElement('body').render();

一切正常。我究竟做错了什么?

4

2 回答 2

0

tagName: 'body',创建一个新body元素(你的第二个)。如果el: 'body'您的元素必须是主体,tagName则用于为没有主体的视图创建新元素。

于 2013-06-05T22:25:18.367 回答
0

只需删除标记名声明就可以了。您的视图根视图将插入主体(您的区域 el)为自己创建一个 div,该 div 将成为其在 el 上。

如果 div 是不可接受的,并且您需要区域 el 作为主体,则更改您的区域声明

Application.addRegions({
    bodyRegion:"body" // this will create your new region just fine with body as its el
});

你的观点应该是这样的......

Backbone.View.extend({
el: 'body',  // with this line your view will be atached to an existing element in this case the body.


initialize: function(options) {
    logger.init('root');
    loader.loadTemplate(template);
    this.headerView = new HeaderView();
    this.usersView = new UsersView();
},

render: function() {
    logger.render('root');
    this.$el.html(ich.rootTemplate);
    this.headerView.setElement(this.$el.find('#header')).render();
    this.usersView.setElement(this.$el.find('#main')).render();
    return this;
}

});

于 2013-06-06T00:16:23.790 回答