Question

来自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特定方法来重用代码？

Answer 1

我认为问题是this函数中的triggerFilterEvent指的是eventBus对象而不是您的视图。试试这个：

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

这是方便的Underscore方法之一。更多信息here

Answer 2

尝试

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

Answer 3

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
  });

},

使用自定义方法的骨干视图

3 个答案: