Добавление элементов в сенсорную панель Sencha через конструктор - PullRequest
Новая
       16

Добавление элементов в сенсорную панель Sencha через конструктор

0 голосов
/ 31 января 2012

Я пытаюсь добавить элементы в дочерний класс панели Sencha Touch (2.0) из конструктора.Приведенный ниже код: 

    Ext.define("MyApp.view.Icon", {
        extend: "Ext.Panel",
        config: {
            layout: "vbox" //ensures caption appears directly below image
        },
        constructor: function(cfg) {
            this.add(
                //First we add the icon image
                {
                   xtype: "image",
                   src: cfg.src,
                   width: cfg.width,
                   height: cfg.height
                },
                //Then we add the icon caption
                {
                   xtype: "panel",
                   html: cfg.caption
                }
            );
            return this;
        }
    });
    var anIcon = Ext.create("MyApp.view.Icon", {
                                             src: "http://placehold.it/80", 
                                             width: 100,
                                             height: 100,
                                             caption: "My Icon"});

При этом появляется ошибка:

Uncaught TypeError: Cannot call method 'has' of null

И, похоже, она возникла из this.add().Я также попробовал this.self.add(), что тоже не работает.Нет ли способа вставить элементы из конструктора?

Ответы [ 2 ]

2 голосов
/ 06 марта 2012

На самом деле это сочетание того, что написал @adis: 

constructor: function(config) {
    this.callParent(config);
    this.add({...});
}

Конструктор - это свойство, для которого определен конструктор.И callParent используется для передачи объекта конфигурации родительскому конструктору.

0 голосов
/ 31 января 2012

Я бы использовал initComponent() (см. API здесь ). Обратите внимание на эту строку в документации API:

Метод initComponent должен содержать вызов callParent, чтобы обеспечить также вызов метода initComponent родительского класса.

Так что я бы пошел на: 

initComponent: function() {
     this.add(
            //First we add the icon image
            {
               xtype: "image",
               src: cfg.src,
               width: cfg.width,
               height: cfg.height
            },
            //Then we add the icon caption
            {
               xtype: "panel",
               html: cfg.caption
            }
        );

    this.callParent();
}

Вы пробовали это?

ОБНОВЛЕНИЕ 2012-01-30: Извините, мой плохой, прочитал точно!

Вы сделали это правильно. Почему вы возвращаете this в конструкторе? Я бы заменил эту часть, позвонив this.initConfig(cfg): 

constructor: function(cfg) {
        this.add(
            //First we add the icon image
            {
               xtype: "image",
               src: cfg.src,
               width: cfg.width,
               height: cfg.height
            },
            //Then we add the icon caption
            {
               xtype: "panel",
               html: cfg.caption
            }
        );
        this.initConfig(cfg);
    }
...