0

我正在尝试动态扩展 Backbone.js 视图的渲染功能。在这样做时,我希望能够在调用渲染之前和之后触发一个事件。我尝试覆盖该函数并调用旧函数,该函数有效,但所有绑定到渲染函数的模型都失去了它们的绑定。我目前拥有的代码如下,如果我传入创建的 Backbone.js 视图:

function bindRenders(view) {

    view.render = (function() {
        var cachedRender = view.render;

        return function() {
            console.log("before render");
            cachedRender.apply(this, arguments);
            console.log("after render");
        };
    }());
}

同样,上面的代码可以工作,但所有模型都通过以下方式绑定到渲染函数:

    this.model.on('change', this.render, this);

休息。我找到的唯一解决方案是在覆盖函数后重新绑定模型的 .on('change') 事件。然而,并不是每个视图的模型都会以这种方式绑定。很感谢任何形式的帮助!谢谢!

4

1 回答 1

1

你是什​​么意思'打破'?当模型更改时,您之前的渲染代码仍然会被调用?

那是因为绑定到“更改”事件的函数不是您的新函数,您只是更改视图的“渲染”属性,而不是更改时执行的内容。我想如果您的绑定是:this.model.on('change', function(){return this.render()}, this)

但我不明白你为什么想要那个。在我看来,你应该使用继承来应用这种常见的行为。

类似的东西(非常简化)

var MyBaseView = Backbone.View.extend({
  ...
  render: function(){
    this.trigger('beforeRender');
    this.beforeRender()

    //do something generic
    ...

    this.afterRender()
    this.trigger('afterRender');
  }
  ...
});

var MyOtherView = MyBaseView.extend({
  ...
  beforeRender: function(){
    //do something specific
  }

  //do NOT override "render"

  afterRender: function(){
    //do some other specific things
  }
  ...
});

或者像这样一个更好的解决方案Backbone.js 视图继承

另外我认为https://github.com/tbranyen/backbone.layoutmanager有很多你想要实现的目标。

于 2012-09-22T13:58:50.873 回答