listen在backbone.js中的另一个视图中使用时不起作用

时间:2013-06-03 12:50:42

标签: backbone.js

我是骨干的新手。我有一个名为AbcView的视图 abc.js

var AbcView = Backbone.View.extend({

    events: {
        "click" : "display",
    },
    display: function(e){
        console.log("hello");
        alert("click function");
    }
});

现在我将这个abc.js传递给另一个xyz.js文件并使用ListenTo在另一个视图中调用它。

xyz.js

var xyzView = Backbone.View.extend({
    initialize: function(){
        var AbcView = new AbcView ();
        this.lisenTo(AbcView, "click",this.display);
    },
    render: function(){
        var html = this.template(AbcView);
        this.$el.html(html);
        return this;
    },
    display: function(e){
        console.log("parent hello");
        alert("parent display function");
    }
});

使用abc.js点击事件触发正常。但是使用xyz.js单击事件不会触发。

这是调用listenTo的正确方法吗?

2 个答案:

答案 0 :(得分:3)

未在View对象上委托DOM事件。

如果你想模仿这个,你必须用ABC display方法手动发出事件:

display: function(e){

    // Trigger manually
    this.trigger("click");

    // Your usual code
    console.log("hello");
    alert("click function");
}

就最佳做法而言,我可能会将“点击”重命名为更具描述性的事件名称。

答案 1 :(得分:3)

Backbone的onlistenTo用于收听Backbone ModelsCollections上的活动。

http://backbonejs.org/#Events-catalog

这是一件很重要的事情。它与UI事件绑定不同,如http://backbonejs.org/#View-delegateEvents中所述。

话虽这么说,你可以使用西蒙建议将两者混合在一起的东西。