使用自定義方法的主幹視圖

來自Java世界我已將自定義方法添加到我的視圖中，但出於某種原因，我無法在視圖內調用它們。看起來Backbone.View.extend的行爲並不像我預期的那樣。使用自定義方法的主幹視圖

... 
    var TreeView = Backbone.View.extend({ 
    el: '#org-tree', 

    initialize: function() { 
     eventBus.on("route:change", this.triggerFilterEvent); 
     this.listenTo(treeItems, 'sync', this.render); 
     treeItems.fetch({ 
     reset: true 
     }); 
    }, 

    render: function() { 
     ... 
    }, 

    foo: function() { 
     console.log("foo"); 
    }, 

    triggerFilterEvent: function(name) { 
     this.foo(); 
     ... 
    } 

    }); 
    ...

以下代碼將導致Uncaught TypeError: Object #<Object> has no method 'foo'。然而，我註冊爲eventHandler回調函數的其他自定義方法triggerFilterEvent可以正常工作。

1）爲什麼？ 2）如何通過聲明TreeView特定的方法來重用代碼？

來源

2014-01-07 Will

我認爲問題在於函數中的this指的是eventBus對象而不是您的視圖。試試這個：

eventBus.on("route:change", _.bind(this.triggerFilterEvent, this));

這是一個方便的Underscore方法可用。更多信息here

來源

2014-01-07 14:19:47

嘗試除非我記錯了seoncd參數（'this'）在'bind'通話仍然是指'eventBus'，所以它還是贏了」工作。要使用'bind'，你首先需要根據我的答案保存對上下文的引用。 –

適用於我，綁定發生在初始化，在這個階段'this'仍然指向視圖。這似乎是我最優雅的解決方案。謝謝！ – Will

與

initialize: function() { 
    var self = this; 
    eventBus.on("route:change", self.triggerFilterEvent); 
    this.listenTo(treeItems, 'sync', this.render); 
    treeItems.fetch({ 
    reset: true 
    }); 
}

來源

2014-01-07 14:22:14

initialize: function() { 

    var self = this; 
    eventBus.on("route:change", function(){ 
    // use "self" because in this scope "this" refers to "eventBus" 
    self.triggerFilterEvent(); 
    }); 

    // OR 
    this.listenTo(eventBus, 'route:change', this.triggerFilterEvent) 

    this.listenTo(treeItems, 'sync', function(){ 
    this.render 
    }); 

},

來源

2014-01-07 14:24:05

使用自定義方法的主幹視圖

回答

相關問題