Question

我正在尝试使用Backbone（和其他库）创建树形可视化小部件符合MVC模式。

我有一个Node模型和一个Tree集合：

var Node = Backbone.Model.extend({
    defaults: {
        name : 'NewNode',
        _id : null,
        parent_id: null,
        type : ''
    },
    idAttribute: '_id'
});

var Tree = Backbone.Collection.extend({
    model: Node
});

我对每个人都有一个观点：

NodeView - 呈现特定节点的HTML

TreeView - 遍历集合中的每个节点并将它们附加到div容器。

var TreeView = Backbone.View.extend({

    ...

    render: function () {
        this.collection.forEach(this.addNewNode, this);
        return this;
    },
    addNewNode: function(nodeModel){
        var nodeView = new NodeView();
        nodeView.render();
        this.$el.find('.gnodes').append(nodeView.el);
        return this;
    },

    ...

我还有一个充当我的控制器的模块（非骨干＆路由器\控制器）然后我用Tree集合实例化TreeView。

    var config = _.extend({}, defaults, options);
    var tree = new Tree();
    config.collection = tree;
    var treeView = new TreeView(config);

我的一个观看事件是点击某个节点来编辑其信息 - 因为它是在一个节点上发生的一个事件，所以我有理由把它放在NodeView上。

var nodeView = SVGView.extend({
    ...

    events: {
        'click [data-action="editTitle"]': 'editNodeName'
    },

但现在我有一个问题 - 如何将此事件冒泡到控制器（因此它可以对它做出反应）？

我的控制器没有NodeView的实例 - TreeView就是这个地方我创建了我的NodeView（用于渲染）。

我应该通过TreeView冒泡事件吗？
或者我应该在Controller中实例化NodeView吗？

注意：我试图简化一些事情，因此我没有透露所有视图和控制器的代码。

Backbone和MVC - 事件冒泡

0 个答案: