Жизненный цикл компонентов с детьми

Я смущен тем, где можно назвать различные аспекты жизненного цикла детей в составных компонентах. Я не вижу способа использования одного компонента в другом компоненте, который, в свою очередь, может использоваться в других и т. Д. К сожалению, Майкл Болинс - «Закрытие окончательного руководства» не дает никаких примеров. Я также не могу найти таких примеров в демонстрациях Closure или в Интернете.Жизненный цикл компонентов с детьми

Вот мой компонент с детьми:

goog.provide('MainToolbar'); 

goog.require('goog.ui.Button'); 
goog.require('goog.ui.Container'); 
goog.require('goog.ui.FlatButtonRenderer'); 

MainToolbar = function(){ 
    goog.ui.Container.call(this, goog.ui.Container.Orientation.HORIZONTAL);  
}; 
goog.inherits(MainToolbar, goog.ui.Container); 

MainToolbar.prototype.createDom = function(){ 
    var this_ = this; 
    // Pre-render the container, just to do something different. 
    //hc.render(goog.dom.getElement('main-buttons')); 
    goog.array.forEach(
     ['Happy', 'Sleepy', 'Doc', 'Bashful', 'Sneezy', 'Grumpy', 'Dopey'], 
     function(item) { 
      var c = new goog.ui.Button(item, 
       goog.ui.FlatButtonRenderer.getInstance());   
      c.addClassName('goog-inline-block'); 
      c.setId(item);   
      this_.addChild(c, true); 
     }); 
};

Вот как я это называю:

mainToolbar = new MainToolbar(); 
mainToolbar.render(goog.dom.getElement('main-buttons'));

Проблема заключается в том, что MainToolbar.prototype.createDom называет себя второй раз, и я получаю

Uncaught Error: The object already contains the key "Happy" from myApp

Возможно, addChild следует поместить в другое место, но где? Конструктор? enterDocument? И как он должен масштабироваться?

UPDATE: Вот CallStack показывает второй вызов:

MainToolbar.createDom (MainToolbar.js:70) 
goog.ui.Component.addChildAt (component.js:1009) 
goog.ui.Component.addChild (component.js:913) 
(anonymous function) (MainToolbar.js:81) 
goog.array.forEach.goog.NATIVE_ARRAY_PROTOTYPES.goog.array.ARRAY_PROTOTYPE_.forEach.l (array.js:179) 
MainToolbar.createDom (MainToolbar.js:70) 
goog.ui.Component.render_ (component.js:664) 
goog.ui.Component.render (component.js:621)

источник

2013-04-27 alehro

«Проблема в том, что MainToolbar.prototype.createDom называет себя второй раз» - Когда это происходит во второй раз? – ne8il

@ ne8il, я добавил callstack, см. UPDATE. – alehro

Метод addChildAt из goog.ui.Component (наследуется goog.ui.Container) имеет проверку, чтобы убедиться, что если вы пытаетесь для рендеринга дочернего элемента управления также должен быть предоставлен родительский элемент. Она делает это путем проверки наличия «this.element_»:

(линия 1023 в моей копии component.js)

if (!this.element_) { 
    this.createDom(); 
}

Это где она становится дублируется. При переопределении метода createDom, вам необходимо либо вручную создать этот объект:

this.element_ = goog.dom.createDom('div');

или просто дайте унаследованный класс сделать работу:

goog.base(this, 'createDom');

Обычно в верхней части метода перед любой работой готово.

источник

2013-04-29 21:04:34 ne8il

Жизненный цикл компонентов с детьми

ответ

Смежные вопросы