用Ext实现js方法的继承,以及扩展Ext组件的开发

Ext.namespace("Ext.ux");

Ext.ux.MyTree = Ext.extend(Ext.tree.TreePanel, {
   animate: true,
   enableDD: false,
   border: false,
   rootVisible: true,
   autoScroll: true,
   height: 500,
   initComponent: function()
   {
    this.root = new Ext.tree.AsyncTreeNode({
       id: "root",
       text: "菜单树"
      });
    this.loader = new Ext.tree.TreeLoader({
       dataUrl: "BBM/getTree.action",
       listeners: {
        "beforeload": function(treeLoader, node)
        {
         treeLoader.baseParams.id = (node.id != "root"
           ? node.id
           : "");
        }
       }
      });
    Ext.ux.MyTree .superclass.initComponent.call(this);
   }
  })

Ext.reg("myTree", Ext.ux.MyTree );
/*Ext.onReady(function()
  {
   Ext.BLANK_IMAGE_URL = "../resources/images/s.gif";
   Ext.QuickTips.init();
   Ext.form.Field.prototype.msgTarget = "side";
   var viewport = new Ext.Viewport({
      layout: "fit",
      items: {
       id: "菜单树",
       region: "center",
       xtype: "myTree"
      }
     })
  })*/

       其中的innitComponemt需要superclass.initComponent.call(this);子类.superclass.initComponent.call(this);来调用父类的初始化方法.

        通过查看Ext组件继承关系,我们会在原代码里找到,基类调用this.initComponent()来初始化组件.initEvents()来初始化事件.

所以我们可以继承父类组件,重写initComponent、initEvents,并且用this.来增加属性或函数或绑定事件,如果重名则会覆盖原有属性或函数.

        另外在源代码里我们又找到Ext.reg("textarea",Ext.form.TextArea);这是给组件注册xtype的名称.有了xtype我们就可以更方便的使用自己的组件了.