3

我找不到关于这个主题的问题,尽管我猜以前有人会遇到过这个问题。对不起,如果我要重新发布。

我正在创建的组件有问题。想象一下实现为 ItemView 的组件,它将 UI 中的某些元素定义为“View.ui”哈希。

如果我想通过子类化该组件并添加额外的 ui 元素定义来创建该组件的专用版本,会发生什么?我在这里得到的是新定义覆盖了父定义,因此父功能中断。

是否有解决此问题的通用解决方案?

我想到的唯一一个是调整基本 Marionette View 类的“.extend”功能,以便在子类化时特别处理这些“ui”和“triggers”属性,使用更像“ .merge”的东西而不是“_。延长”。

还有其他想法吗?

提前致谢,

4

3 回答 3

2

您可以在继承对象构造函数中使用 _.extend 来合并散列。

小提琴:http: //jsfiddle.net/puleos/zkBCm/

var ParentView = Backbone.Marionette.ItemView.extend({
    ui: {
        link : 'a',
        checkbox : "input[type=checkbox]"
    }
});

var ChildView = ParentView.extend({
    ui: {
        list : 'ul'
    },
    constructor: function(options) {
        var args = Array.prototype.slice.apply(arguments);
        ParentView.prototype.constructor.apply(this, args);
        this.ui = _.extend(this.ui, ParentView.prototype.ui);
    }
});

var parentView = new ParentView();
var childView = new ChildView();

console.log('parent', parentView.ui); // Returns link & checkbox
console.log('child', childView.ui);   // Returns ul, link & checkbox
于 2013-05-10T17:56:06.680 回答
1

和斯科特的一样,但我认为它更直截了当。我没有看到重写构造函数的意义。我正在查看每种视图类型(ItemView、CompositeView、CollectionView)的构造函数,它们的构建方式各不相同。所以只需将最后一行放在初始化函数中,它应该适用于所有视图。

所以像这样。

initialize: function () {
    this.ui = _.extend(this.ui, ParentView.prototype.ui);
},
于 2015-04-02T00:04:06.207 回答
1

我的解决方案更像这样:

var ParentView = Backbone.Marionette.ItemView.extend({
    events: {
        'click @ui.link': 'onLinkClick'
    },

    ui: {
        link : 'a',
        checkbox : 'input[type=checkbox]'
    },

    onLinkClick: function () { ... }
});

var ChildView = ParentView.extend({
    events: _.extend({
       'click @ui.buttonStuff': 'onButtonStuffClick'
    }, ParentView.prototype.events),

    ui: _.extend({
        buttonStuff : 'button[data-action=do_stuff]'
    }, ParentView.prototype.ui),

    onButtonStuffClick: function () { ... }
});

是的,您必须为每个子类都这样做,但语法相当紧凑。

我一直用 Backbone 做这件事。我还没有在任何 Marionette 项目中尝试过它,但我看不出它为什么不起作用的任何原因。

这类似于 minijag 的解决方案,但更有效。不是每次实例化类时都扩展散列,而是在定义类时精确地扩展一次。

于 2015-10-14T00:28:08.510 回答