backbone.js - 在backbone.js的另一个 View 中使用时listenTo不起作用

Question

我是主干的新手。我有一个名为 AbcView 的 View
abc.js

var AbcView = Backbone.View.extend({

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

现在我将这个 abc.js 传递给另一个 xyz.js 文件并使用 ListenTo 在另一个 View 中调用它。
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的正确方法吗？

Answer 1

DOM 事件不委托(delegate)给 View 对象。

如果你想模拟这个，你必须在 ABC display 中手动发出事件。方法:

display: function(e){

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

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

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