0

出于某种原因,我无法this正确传递给回调以呈现视图。我已经尝试过 _.bind 和 _.bindAll 方法,但无论我使用哪种方式传递上下文,我最终都会得到与初始化this不同的渲染

任何帮助表示赞赏

  Navigation.Collection = Backbone.Collection.extend({
    model : Navigation.Model,
    comparator : function(item) {
      return item.get("orderId");
    }
  });

  Menu = new Navigation.Collection();

  Navigation.Views.List = Backbone.View.extend({
    el : 'nav',
    tagName : "div",
    className : "navigation",
    collection : Menu,
    initialize : function(e) {
      console.log(this);
      this.template = "navigation/list";
      this.settings = Settings;

      this.collection.on("add", this.render, this);
    },
    render: function() {
      console.log(this);

      var renderedContent = this.template(this.collection.toJSON());
      console.log(renderedContent);

      return this;
    },

绑定示例:

initialize : function(e) {
  this.collection.on("add", _.bind(this.render, this));
}

bindAll 示例:

initialize : function(e) {
  _.bindAll(this, "render");
  this.collection.on("add", this.render);
}

控制台输出

第一次打印:

child {cid: "view2", options: Object, views: Object, __manager__: Object, _removeViews: function…}

第二次打印:

Object {resolve: function, resolveWith: function, reject: function, rejectWith: function, notify: function…}

编辑:添加调用“渲染”的位置。这是在代码中定义 Navigation.View.List(见上文)之后立即出现的。

Navigation.registerModule = function(data) {
  _.extend(data, {
    id : Math.random()
  });
  Menu.add(new Navigation.Model(data));
  Navigation.LayoutManager.removeView(true);
  Navigation.cachedRendering = null;
};
Navigation.View = new Navigation.Views.List();

Navigation.LayoutManager = new Backbone.Layout({
  views : {
    nav : Navigation.View
  }
});

Navigation.LayoutManager.$el.appendTo("nav");

Navigation.LayoutManager.render();

return Navigation;

编辑:如果其他人偶然发现同样的事情,解决方案是使用beforeRenderand afterRender。发生混乱是因为我正在升级依赖项,而旧版本的主干.layoutmanager没有这两个助手,render()而是使用了 - 带有manage访问after状态的参数。

4

2 回答 2

1

请尝试以下操作:

this.listenTo(this.collection, "add", this.render);

ListenTo 是在 0.9.x 中添加的,推荐是因为“......当您想要删除视图时,可以更轻松地创建所有观察者都未绑定的视图。”,引用自主干文档。这是一个很好的答案,它也详细介绍了上下文,这可能会有所帮助:https ://stackoverflow.com/a/16824080/486434

于 2013-07-24T15:46:18.710 回答
1

您的视图渲染被这行代码调用:

https://github.com/tbranyen/backbone.layoutmanager/blob/master/backbone.layoutmanager.js#L472

  // Render the View into the el property.
  if (contents) {
    rendered = options.render.call(renderAsync, contents, context);
  }

问题在于它options.render.call(renderAsync, contents, context);绑定了作为承诺的this关键字。renderAsync

我不熟悉 Backbone Layout Manager,但看起来原始上下文是作为render方法的第二个参数传递的。然后,您可以对渲染方法稍作修改来使用它。

render: function( contents, context ) {
      var self = context ? context : this;    
      var renderedContent = this.template(self.collection.toJSON());    
      return this;
    },
于 2013-07-26T16:09:39.213 回答