儿童组件的生命周期

我对混合组件中儿童生命周期各个方面的调用感到困惑。我没有看到一个组件如何用于其他组件，而其他组件可能会用于其他组件。不幸的是，Michael Bolins-'关闭权威指南'没有给出任何示例。在闭幕演示或互联网上我都找不到任何这样的例子。儿童组件的生命周期

这里是我的组件有孩子：

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？它应该如何扩展？

更新：这里是调用堆栈显示了第二个电话：

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 2013-04-29 12:54:39

@ ne8il，我已经添加了callstack，请参阅UPDATE。 – alehro 2013-04-29 16:28:45

goog.ui.Component的addChildAt方法（通过继承goog.ui.Container）的检查，以确保如果你想为了呈现孩子的控制权，父母也必须呈现。它通过检查“this.element_”的存在：（在我component.js的副本线1023）

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

这是它变得重复。当你重写createDom方法，你需要手动创建这个属性：

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

或只是让继承类做的工作：

goog.base(this, 'createDom');

一般在方法的顶部任何工作前，已经完成了。

来源

2013-04-29 21:04:34 ne8il

儿童组件的生命周期

回答

相关问题