Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Let me try an updated answer in terms of ExtJS versions 4.0-4.2 and beyond.</p> <p>The <code>constructor()</code> is the object/class <strong>before create</strong> method. And <code>initComponent()</code> is the component <strong>before show</strong> method. </p> <pre><code>constructor: function(config) { // ctor #1 - insert code here to modify config or run code to inject config // probably the cheapest place to make changes - before anything has been built this.callParent(arguments); // ctor #2 - insert code here if you need to make changes // after everything has been rendered and shown, IIUC }, initComponent: function() { // this function runs between ctor #1 and ctor #2 // initComponent #1 - the UI component object tree is created, // (this object and child objects from config { items: [{...}]}) // but they have not yet been rendered to DOM or shown. this.callParent(arguments); // initComponent #2 - I believe this is equivalent to ctor #2, // I would prefer ctor as it is more universal. } </code></pre> <p>Panels with children or complex layout you'll probably need to use initComponent, because you'll need to inspect and manipulate the components (the UI object graph).</p> <p>But for individual form elements (combobox, button, etc.) then I stick with constructor, which I believe is lighter (before any complex object construction or DOM changes) and is more universal. IOW constructors can be used for simple UI, models, and data stores; the latter two can't use initComponent. </p> <p>So I only use initComponent when there's a reason to do so. Often when I write an initComponent function I'm trying to manipulate child UI objects, and my next step is to extract that child control into its own Ext.define(), the move the custom code to run in the child control class, which removes the complex init from the parent panel. This process I've repeated 4 times in my latest page.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload