骨干+ RequireJS对象继承

Question

我有使用Backbone和RequireJS的问题。

BaseListView.js

define(['backgrid', 
 
    'backbone', 
 
    'underscore', etc.], function (
 
    Backgrid, 
 
    Backbone, 
 
    _) { 
 
    
 
    return Backbone.View.extend({ 
 
    initialize: function() { 
 
     if(needDeleteCell) { 
 
     this.addDeleteCell(); 
 
     } 
 
     this.render(); 
 
    }, 
 

 
    addDeleteCell: function() { 
 
     var ListViewDeleteCell = DeleteCell.extend({ 
 
     defaults: { 
 
      successMsg: this.attributes.deleteSuccessMsg, 
 
      failureMsg: this.attributes.deleteFailureMsg 
 
     } 
 
     }); 
 
     this.columns.push({ 
 
     name: "delete", 
 
     label: "", 
 
     editable: false, 
 
     cell: ListViewDeleteCell 
 
     }); 
 
    } 
 
    }); 
 
});

ChildView.js

define(['i18next', './common/BaseListView'], function (i18n, BaseListView) { 
 
    'use strict'; 
 

 
    return BaseListView.extend({ 
 
    columns: [{ 
 
     name: "_id", 
 
     label: i18n.t('app.operationForm.id'), 
 
     editable: false, 
 
     cell: "string", 
 
     renderable: false 
 
    }, { 
 
     name: "name", 
 
     label: i18n.t('app.operationForm.nameLabel'), 
 
     editable: false, 
 
     cell: "string" 
 
     }] 
 
    }); 
 
});

现在，如果我想要使用子视图的多个实例，我有多个“删除”列（由于BaseListView中的columns.push（）），就像父级的columns属性是单例实例一样。

在这种情况下，ChildView不延长BaseListView

什么是Bacbkone + RequireJS这样做的正确方法是唯一的类？

谢谢。

编辑：这是相同的问题：Switching between singleton and prototype scope using RequireJS但我想避免工厂解决方案。

Answer 1

在你的情况ChildView.columns是原型范围。每个实例都有相同的columns。

你可能在initialize功能初始化columns：

define(['i18next', './common/BaseListView'], function (i18n, BaseListView) { 
    'use strict'; 

    return BaseListView.extend({ 
    initialize: function() { 
     this.columns = [{ 
     name: "_id", 
     label: i18n.t('app.operationForm.id'), 
     editable: false, 
     cell: "string", 
     renderable: false 
     }, { 
     name: "name", 
     label: i18n.t('app.operationForm.nameLabel'), 
     editable: false, 
     cell: "string" 
     }]; 
     BaseListView.prototype.initialize.call(this); 
    }); 
    } 
}); 

Answer 2

你ChildView.columns是一个阵列和实例之间共享。你可以从骨干处理默认值的哈希值的方式中汲取灵感和

1. 通过设置columns属性

例如，

在 ChildView

有BaseListView阴影定义columns作为函数这个定义

var ChildView = BaseListView.extend({ 
    columns: function() { // define `columns` as a function 
     return [{ 
      name: "_id", 
      // ... 
     }, { 
      name: "name", 
      // ... 
     }]; 
    } 
}); 

and

var BaseListView = Backbone.View.extend({ 
    initialize: function() { 
     this.columns = _.result(this, 'columns'); 
     this.addDeleteCell(); 
    }, 

    addDeleteCell: function() { 
     this.columns.push({ 
      name: "delete", 
      // ... 
     }); 
    } 
}); 

并演示http://jsfiddle.net/nikoshr/9fk8axpk/1/