[ExtJS5 learning notes] section 20th Extjs5 uses the array push method to dynamically create and load components, and extjs5push

[ExtJS5 learning notes] section 20th Extjs5 uses the array push method to dynamically create and load components, and extjs5push

Address: http://blog.csdn.net/sushengmiyan/article/details/39226773

Official example: http://docs.sencha.com/extjs/5.0/apidocs! /Api/Array-method-push

Author: sushengmiyan

Certificate ------------------------------------------------------------------------------------------------------------------------------------

The previous section shows how to use the fieldset set to manage components. Each component in fieldset is specified in items, as shown below:

As you can see, items is actually an array, which can be seen as an array of json format styles. In this case, after we define such a string style, we can use the push method of the array to load these items one by one to dynamically create components.

First, let's take a look at the effect. fieldset on the right is dynamically created and loaded through the push method of array:

The Code is as follows:

Ext. define ('fieldsettest. view. form. baseForm ', {extend: 'ext. form. panel ', alias: 'widget. baseform ', title: 'formpanel with fieldSet', frame: true, bodyStyle: 'padding: 5px 5px 0', items: [], initComponent: function () {var me = this; var obj = [{// Fieldset in Column 1-collapsible via toggle buttonxtype: 'fieldset', columnWidth: 0.5, title: 'fieldset 1', collapsible: true, defaultType: 'textfield ', defaults: {anchor: '000000'}, layout: 'anchor', items: [{fieldLabel: 'First name', Name: 'first', allowBlank: false}, {fieldLabel: 'Last name', Name: 'last', allowBlank: false}]}, {// Fieldset in Column 1-collapsible via toggle buttonxtype: 'fieldset', columnWidth: 0.5, title: 'fieldset 2', collapsible: true, defaultType: 'textfield ', ults: {anchor: '20140901'}, layout: 'anchor', items: [{fieldLabel: 'First name', Name: 'first', allowBlank: false}, {fieldLabel: 'Last name', Name: 'last', allowBlank: false}]; Ext. each (obj, function (field, indext) {me. items. push (field) ;}); this. callParent (arguments );}});