Extjs 组件继承 模板说明（同GridPanel案件）

1. 重写initComponent()方法，并在该方法在调用父类的initComponent（）方法。 

如：subclass.superclass.initComponent.call(this);

2. 在initComponent中，出现以下语句，覆盖父类属性

Ext.apply(this, {

    title : "aaa"

});

3. 基本模板代码例如以下：

Ext.ns("my.component");

my.component.MyGridPanel = Ext.extend(Ext.GridPanel,{

	/**

	 * 初始化组件

	 */

	initComponent : function(){

		// 数据仓库

		var store = this.store;

		if(!store){

			store = this.buildStore(this.baseParams);

		}

		// 列模型

		var cm = this.cm;

		if(!cm){

			cm = this.buildCm();

		}

		// 复选框.组件属性使用selModel配置

		var sm = new Ext.grid.CheckboxSelectionMedol();

		Ext.apply(this, {

			// 这里加上组件的属性

			selModel : sm,

			// 分页工具条

			bbar : new Ext.PagingToolbar({

			}),

			colModel : new Ext.grid.ColumnModel({

				// 这里加上列模型的属性

				columns : cm;

			}),

			// 对该组件设置监听器

			listeners : {

				"dbclick" : function(){},

				"rowClick" : function(){},

				......

			}

		});

		my.component.MyGridPanel.superclass.initComponent.apply(this);

	},

	/**

	 * 构建store

	 */

	buildStore : function(baseParams){

		Ext.apply(baseParams, {

			// 分页条件

		});

		return new Ext.data.JsonStore({

			url : "",

			idProperty : "", // id属性值配置

			totalProperty : "", //

			autoLoad : boolean,

			root : "data" // 数据的根。后面的json格式对象数组。

			fields : [

				{name : "", mapping : ""},

				{name : "", mapping : ""},

				......

			]

		});

	},

	/**

	 * 构建数据列

	 */

	buildCm : function(){

		return [

			{name : "", dataIndex : ""},

			{name : "", dataIndex : ""}

		];

	},

	// 通过选择模型，获取选中的记录。是多条的

	getSelections : function(){

		var records = this.getSelectionModel().getSelections();

		return records;

	}

	// 通过选择模型。获取选中的记录。仅仅有一条

	getSelected : function() {

		var record = this.getSelectionModel().getSelected();

	}

});