Какие хорошие подходы к повторному использованию частей конфигурации?

Question

У меня есть несколько сеток, которые имеют общие столбцы, например (проблема не ограничивается столбцами, любым объектом конфигурации). В настоящее время я делаю что-то вроде этого:

//columns.js 
var columns = {"reusable1": {...}, "reusable2": {...}}; 

//grid views 
Ext.define('MyApp.view.Grid', { 
    columns: [ 
     {text:'inline column1'}, 
     columns.reusable1, 
     columns.reusable2, 
     {text:'inline column2'}, 
    ] 
}); 

Это получает работу, но что было бы лучше, подход, который работает аналогичным образом (без создания уникального xtype для каждой конфигурации детали или модификации конфигов в constructor или initComponent). Я просто хочу, чтобы по-прежнему можно было разместить многострочные шаблоны для повторного использования.

Answer 1

Взгляните на эти конфиги:

• Ext.grid.Panel#cfg-defaults
• Ext.grid.Panel#cfg-columns

defaults конфигурации работает для всего контейнера, где, как columns имеет свой собственный вариант настройки по умолчанию.

Надеюсь, это поможет!

Answer 2

Я думаю, что большинство других вариантов, скорее всего, уменьшат читаемость или просто выглядят откровенно запутанными, но вы можете переопределить базовый класс и включить конфигурацию для "с именем" столбцов.

Я предполагаю, что, когда вы говорите, «не изменяя конфигурацию в конструкторе», вы имеете в виду сетку/сек, реализующую столбцы, а не аналогичную логику, которая может быть убрана где-то в другом месте.

Ext.define('App.override.grid.column.Column', { 
    override: 'Ext.grid.column.Column', 

    config: { 
     name: null  
    }, 

    statics: { 
     namedColumns: { 
      reusable1: { /* ... */ }, 
      reusable2: { /* ... */ }, 
      // ... 
     } 
    }, 

    constructor: function(args){ 
     var _args = args || {}, 
      statics = Ext.grid.column.Column, 
      defaults = statics.namedColumns[_args.name] || {}; 
     this.callParent([Ext.apply({}, _args, defaults)]); 
    } 
}); 

Использование

Ext.define('App.view.Grid', { 
    columns: [ 
     { text: 'inline column1' }, 
     { name: 'reusable1'  }, 
     { name: 'reusable2'  }, 
     { text: 'inline column2' }, 
    ] 
}); 

Преимущества

• прибрала прочь в пределах структуры проекта, а не существующий в глобальном масштабе.
• Avoids проблемы потенциальной зависимости, поскольку Sencha CMD обеспечит переопределение (и расширение по умолчанию) до того, как объявится какая-либо сетка.
• Названные конфигурации более гибкие и могут быть аккуратно переопределены в линию.
  , например.{ name: 'reusable', flex: 2 /* superseding value */ }

Недостатков

• xtype не может быть использован в качестве части конфигурации по умолчанию, это по-прежнему необходимо будет указано инлайна для чего-нибудь, кроме регулярной сетки колонка.
  , например.{ xtype: 'datecolumn', name: 'some-defaults' }

» Fiddle