覆盖 Sencha Touch class

Question

我在 Sencha Touch 应用程序中工作，我有下一个 doubt/issue 使用此代码。

Ext.each(records, function(record){
            newItem = Ext.create('Ext.Panel', {
                material: record.get('material'),
                cls: 'setitems-item',
                tpl: '<div class="setitems-item-material">{material}</div>' +
                '<div class="setitems-item-atpstatus {atpstatus}">{cquantity}</div>' +
                '<div class="setitems-item-cdd">{[Cicero.Helper.formatSAPdate2Str(values.cdd)]}</div>' +
                '<div class="setitems-item-netprice">{netprice}</div>' +
                '<div class="setitems-item-netvalue">{netvalue}</div>',
                items: [
                    {
                        xtype: 'button',
                        text: Cicero.Text.getText('SC_I_CONDITIONS_BTN'),
                        itemId: 'setItemConditions',
                        cls:'setConditions'
                    }
                ],
                data: record.getData()
            });
            newSetItems.push(newItem);
        }, this);

并且此代码管理为来自控制器的每个模式 window 创建的按钮。

manageSetItemConditions: function (button) {
    var matId = button.up('panel'),
    //var matId = button.up('panel').material,
        recordId = button.up('cartItem').getRecordId(),
        record = Ext.getStore('CartItems').getById(recordId),
        conditionsStore = record.setitems().findRecord('material', matId).conditions(),
        orderTypeConditionsStore = this.getCartHeader().down('#headerOrderType').getRecord().sconditions(),
        view = Ext.create('xx.view.cart.Conditions', {
            orderTypeConditionsStore: orderTypeConditionsStore
        });
    //view.setRecordId(record.getId());//TODO: mirar si es necesario
    view.down('dataview').setStore(conditionsStore);
    view.showBy(button);
},

在这里你可以看到属性 "material" 但这不是包含在 Sencha 属性 class, 如何添加这个新配置属性在 class 面板中（在本例中）？

我需要覆盖 class 面板吗？

此代码在 localhost 中运行，但在 Sencha CMD 的生产构建、命令行之后不起作用，因为 material 属性未包含在 class.

中

谢谢！！

Answer 1

您可以扩展面板 class 并明确定义 material 配置，如下所示。我希望 SenchaCmd 对此没问题。

    Ext.define("my.custom.Panel", {
      extend: 'Ext.Panel',
      alias: 'widget.mycustompanel',

      config: {
          /**
           * @cfg {Object} material
           * Custom configuration for material
           */
          material : undefined
      }
    });

并在您的代码中使用如下...

Ext.each(records, function(record){
            newItem = Ext.create('my.custom.Panel', {
                material: record.get('material'),
                // other config
            });
}, this);

Answer 2

在查看 Sencha Touch 代码时，我认为您必须将 material 添加到面板的 eventedConfig 属性，因为设置器在 [=15] 中设置如下=]:

for (name in eventedConfig) {
    if (eventedConfig.hasOwnProperty(name)) {
        nameMap = ExtClass.getConfigNameMap(name);
        data[nameMap.set] = this.generateSetter(nameMap);
    }
}

您不能影响 Ext.create 内的 eventedConfig 属性，您必须为此定义一个覆盖，这会影响所有面板：

Ext.define('MyApp.override.Panel',{
    override: 'Ext.panel.Panel',
    constructor:function() {
        this.callParent(arguments);
        this.eventedConfig.material = "SomeDefaultValue";
    }
});

或定义派生的 class 并使用它：

Ext.define('MyApp.ux.Panel',{
    extend: 'Ext.panel.Panel',
    xtype: 'mypanel',
    constructor:function() {
        this.callParent(arguments);
        this.eventedConfig.material = "SomeDefaultValue";
    }
});

覆盖 Sencha Touch class

Override Sencha Touch class

javascript

extjs

sencha-touch