Лучшие практики, касающиеся initComponent () в Ext.define () - PullRequest
Новая
       4

Лучшие практики, касающиеся initComponent () в Ext.define ()

23 голосов
/ 29 июля 2011

Я пишу все свои компоненты в новом стиле ExtJS для MVC, используя Ext.define().

Я немного затрудняюсь определить свойства внутри initComponent() или просто установить их как property: 42,.

Существуют ли общепринятые передовые практики?

Я колеблюсь между использованием initComponent() только тогда, когда это необходимо (т. Е. Когда я хочу что-то динамическое или установить область видимости), которое сокращает функцию и избавляет меня от уродливых this. с, и всегда использую ее, что имеет преимущество что мне никогда не придется перемещать прежние свойства в initComponent() только потому, что я хочу сделать его более динамичным.

К сожалению, документы Сенчи об этом мало что говорят, и имеющиеся примеры, кажется, делают так, как они хотят.

Ответы [ 3 ]

18 голосов
/ 29 июля 2011

Личная практика, я буду объявлять переменные в области свойств, когда переменные

  • определяют величину, например x, y, width, height
  • переменные, которые ожидают переопределения или настройки, например title, saveBtnTxt, url, fields, iconCls
  • некоторые константы, которые будут иметь специальные префиксы, поэтому не будут переопределенытак легко

Тогда я объявлю items, listeners, this.on, Ext.apply(me, {..}) или что-нибудь, что требует объема объекта (this, me), чтобысижу внутри моего initComponent.Или вещи, которые должны быть изменены / переопределены до того, как все настроено, чтобы пользователь не сломал мой компонент, переопределив некоторые важные переменные.

Конечно, это послужит моим руководством.2 цента

РЕДАКТИРОВАТЬ

О уродливом this, я широко использовал переменную me в своем приложении, и она выглядит намного чище, чем this.Это также помогает мне реже менять прицелы.

11 голосов
/ 04 августа 2011

Я хочу добавить к ответу Лайонела, что лучше объявить любую не примитивную конфигурацию в initComponent.(Под примитивом я подразумеваю строку, логическое значение и число).Array и Object входят в initComponent.
Таким образом, определение должно выглядеть следующим образом: 

Ext.define('My.NewClass', {
  extend: 'OldClass',
  // here all primitive configs:
  cls: 'x-my-cls',
  collapsible: true,
  region: 'west',
  // and so on ...

  initComponent: function() {
    // here you declare non-primitive configs:
    this.tbar = [/* blah-blah */];
    this.columns = [/* blah-blah */];
    this.viewConfig = {/* blah-blah */};
    // and so on ...

    this.callParent(arguments);
  }

  // other stuff
}

Причина, по которой вы должны поместить все не примитивные конфиги в initComponent, заключается в том, что в противном случае конфиги всех экземпляров будут ссылатьсяк тем же объектам.Например, если вы определите NewClass следующим образом: 

Ext.define('My.NewClass', {
  extend: 'OldClass',
  bbar: Ext.create('Ext.toolbar.Toolbar', {
  // ...

bbar всех экземпляров будут ссылаться на один и тот же объект.И поэтому каждый раз, когда вы создаете новый экземпляр, bbar исчезает из предыдущего экземпляра.

0 голосов
/ 29 июля 2011

Я не совсем понимаю ваш вопрос, но это может быть полезно для вас. 

  Ext.define('My.Group', {
// extend: 'Ext.form.FieldSet',
xtype : 'fieldset',
config : {
    title : 'Group' + i.toString(),
    id : '_group-' + i.toString()

},
constructor : function(config) {
    this.initConfig(config);

    return this;
},    
collapsible: true,
autoScroll:true,
.....
});

Вы можете использовать его следующим образом. 

handler : function() {                      
        i = i + 1;
        var group = new My.Group({
            title : 'Group' + i.toString(),
            id : '_group-' + i.toString()
        });
        // console.log(this);
        // console.log(group);
        Ext.getCmp('panelid').insert(i, group);
        Ext.getCmp('panelid').doLayout();
    }
...