ExtJS: установка значений по умолчанию для элементов панели для вложенных объектов - PullRequest
0 голосов
/ 04 июля 2018

Этот вопрос является частью Как установить значения по умолчанию для столбцов Grid в initComponent и размещать их здесь независимо через @ scebotari66 advice на основное сообщение.

Как вы заметите ниже; Ext.Array.map для определения defaults для связанной функции.

// Statment
    initComponent: function () {
    var me = this;
    me.items = Ext.Array.merge(
        me.getFormSt(),
        Ext.Array.map(me.getForm(), function (listFldConfig) { //Aim to using the array map function to set flex property for subset fields
            listFldConfig.flex = 1;
            return listFldConfig;
        }),
        me.getFormEnd()
    );
    me.callParent(arguments)
},

// Implementation
getForm: function () {
        var me = this;
        var form = [
            { // Array.map func. sets `flex` to this obj.
                xtype: 'fieldcontainer',
                layout: { type: 'vbox', align: 'stretch', pack: 'start' },
                items: [
                    {
                        xtype: 'fieldcontainer',
                        layout: 'hbox',
                        items: [
                            {
                                xtype: 'foofield',
                                //flex: 1 //But I need to set `flex` as default for this obj. in nested items array
                            },
                            {
                                xtype: 'barfield',
                                //flex: 1 //But I need to set `flex` as default for this obj. in nested items array
                            }

Дело в том, что эта реализация работает, как и ожидалось, но в этой ситуации я создаю fieldcontainer объект, который включает в себя все другие вещи и предметы внутри. И Array.map устанавливает flex config только для первого fieldcontainer obj. Мне нужно определить flex config только для вложенных items, которые имеют foofield и barfield.

Ответы [ 2 ]

0 голосов
/ 04 июля 2018

По мнению @NarendraJadhav; создал свою собственную структуру ...

Определение;

Ext.define('MyApp.BaseFldCon', {
    extend: 'Ext.form.FieldContainer',
    xtype: 'basefldcon'
});

Ext.define('MyApp.VBoxFldCon', {
    extend: 'MyApp.BaseFldCon',
    xtype: 'vboxfldcon',
    layout: {
        type: 'vbox',
        align: 'stretch',
        pack: 'start'
    }
});

Ext.define('MyApp.HBoxFldCon', {
    extend: 'MyApp.BaseFldCon',
    xtype: 'hboxfldcon',
    layout: {
        type: 'hbox'
    },
    defaults: {
        flex: 1
    }
});

Осуществление;

{
   xtype: 'vboxfldcon',
   items: [
            {
              xtype: 'hboxfldcon',
              items: [
                       {
                           xtype: 'foofield',
                        },
                        {
                           xtype: 'barfield'
                        },
                        {
                           xtype: 'foocombo'
                        }
                     ]
             },
0 голосов
/ 04 июля 2018

Значения по умолчанию определяются с помощью конфигурации defaults для контейнеров:

xtype: 'fieldcontainer',
layout: 'hbox',
defaults: {
    flex: 1
},
items: [
    {
        xtype: 'foofield',
    },
    {
        xtype: 'barfield',
    }

Чтобы покрыть вложенные контейнеры, вы можете вложить несколько defaults конфигов друг в друга:

defaults: {
    defaults: {
        flex: 1
    },
    flex: 1
}

Обратите внимание, что конфигурация xtype как часть объекта defaults может привести к нежелательным результатам, и вам следует использовать конфигурацию defaultType, чтобы определить тип дочерних элементов по умолчанию для контейнер.

...