主干木偶,渲染复合视图两次

Backbone Marionette, rendering composite view twice?

本文关键字:视图 两次 复合      更新时间:2023-09-26

我有这个问题,打印用户数据两次,这是代码:

window.UserData = {}
UserData.Model = Backbone.Model.extend();
UserData.Collection = Backbone.Collection.extend({
  url: '/test.php?c=userData',
  model: UserData.Model,
  parse: function (response) {
    return response.data;
  }
});
UserData.View = Backbone.Marionette.CompositeView.extend({
  tagName: 'span',
  template: Handlebars.compile($('#user-data-template').html())
});
BaseApp.Layout = Backbone.Marionette.Layout.extend({
  template: Handlebars.compile($('#base-layout-template').html()),
  regions: {
    'region_user_data': '#user_data_reg'
  },
  initialize: function () {
    _.bindAll(this);
  },
  onRender: function () {
    var self = this;
    var c = new UserData.Collection();
    c.fetch({
      success: function () {
        var ud = new UserData.View({
          collection: c
        });
        self.region_user_data.show(ud);
      }
    });
  }
});

这个BaseApp布局只在一个区域(body)上渲染一次。

这是模板:

<script id='user-data-template' type='text/x-handlebars-template'>
    <a href="#" id="logout"> Logout </a> Hola {{uname}}
</script>
<script id='base-layout-template' type='text/x-handlebars-template'>
    base page layout
    <div id="user_data_reg" class="user_data_reg"></div>
</script>

这是浏览器(chrome)显示的内容:

Logout Hola Logout Hola 14

你可以看到它显示了两次用户布局但第一次没有显示uname,这有点奇怪,因为在chrome中我有这个:

child {models: Array[0], length: 0, _byId: Object, 
constructor: function, url: "http://localhost/test.php?c=userData"…}

模型只显示1,它所做的是打印两次内容。

同样,当我获取集合数据时,我这样做:

c.fetch({
  success: function () {
    var ud = new UserData.View({
      collection: c
    });
    self.region_user_data.show(ud);
    console.log("print xx");
  }

,它只记录"print xx"一次&

为什么我得到双userData内容,即使集合只抓取一个模型,为什么会发生这种情况?问候。

这是视图类型的问题,而不是使用"CompositeView"我切换到ItemView和问题消失了。我猜木偶强迫使用ItemView单个数据