0

我在使用 Marionette 的 CompositeView 时遇到问题。我使用模板在我的 CompositeView 中渲染我的模型，并想向它添加一个点击事件。不知何故，我无法使用events: { "click": "function" }CompositeView 上的处理程序让事件工作......我做错了什么？

var FactsMenuItem = Backbone.Marionette.ItemView.extend({
    template: tmpl['factsmenuitem'],

    initialize: function() {
        console.log('factsmenuitem');
    },

    onRender: function() {
        console.log('factsmenuitem');
    }

});

var FactsMenuView = Backbone.Marionette.CompositeView.extend({
    template: tmpl['factsmenu'],

    itemView: FactsMenuItem,

    itemViewContainer: ".subs",

    events: {
        'click': 'blaat'
    },

    blaat: function() {
        console.log('this is not working');
    },

    initialize: function() {
        this.model.get('pages').on('sync', function () {
            this.collection = this.model.get('pages');
            this.render();
        }, this);
    },

    onRender: function() {
        console.log('render factsmenu');
    }

});


var FactsLayout = Backbone.Marionette.Layout.extend({

    template: tmpl['facts'],

    regions: {
        pages: ".pages",
        filter: ".filter",
        data: ".data"
    },

    initialize: function(options) {
        this.currentPage = {};

        this.factsMenu = new FactsMenu();
        this.factsView = new FactsMenuView({model: this.factsMenu});
    },

    onRender: function() {
        this.pages.show(this.factsView);
    }

});

编辑： 我删除了一些使问题不清楚的代码......

问题在于compositeview（modelView??）的非collectionview的事件没有被触发。我认为这与 FactsLayoutView 实例化复合视图的方式有关......

4

2 回答 2

1

问题是由区域的渲染方式引起的。在我的 FactsLayout 中使用了以下代码：

initialize: function(options) {
    this.currentPage = {};

    this.factsMenu = new FactsMenu();
    this.factsView = new FactsMenuView({model: this.factsMenu});
},

onRender: function() {
    this.pages.show(this.factsView);
}

显然你不能在 onRender 函数上显示视图......我不得不改变 FactsLayout 的初始化方式：

var layout = new FactsLayout({
    slug: slug
});
layout.render();

var factsMenu = new FactsMenu({ slug: slug });
var factsView = new FactsMenuView({model: factsMenu});

layout.pages.show(factsView);
于 2013-10-28T10:02:01.993 回答
0

也许我没有很好地理解您的问题，但是如果您需要在复合视图中侦听从项目视图触发的事件，您应该执行以下操作。

在项目视图test方法中。

this.trigger("test");

在复合视图initialize方法内。

this.on("itemview:test", function() { });

CollectionView请注意，当从 a (aCompositeView是 a )的项目触发事件时CollectionView，它会以itemview前缀开头。

希望能帮助到你。

编辑：再次阅读您的问题，我认为这不是正确的答案，但是，关于您的问题，我猜复合视图中的点击被项目视图捕获。你能更好地解释你的目标吗？

于 2013-10-15T11:03:35.403 回答