Ext.define 方法

define(String className, Object data, Function createdFn): Ext.Base


 从上面可以看出,define方法最多接受3个参数,className(类的名字),data(Object对象),createdFn(回调函数)。


常用于 define a class,override or extend 一个类的property or function


define: function (className, data, createdFn) {
  if (data.override) {
    return Manager.createOverride.apply(Manager, arguments);
  }
  return Manager.create.apply(Manager, arguments);





 --- 几种使用方法 ---


1、定义一个基本的类




 Ext.define('My.awesome.Class', {


    someProperty: 'something',


    someMethod: function(s) {
        alert(s + this.someProperty);
    }


    ...
});


var obj = new My.awesome.Class();


obj.someMethod('Say '); // alerts 'Say something'


 2、创建一个匿名类(只要将className参数指定为null即可)


Ext.define(null, {
  constructor: function () {
    // ...
  }
}); 


 3、在某些情况下,创建一个包含私有属性的嵌套域是有用的。最好的方法是将第二个参数(即data参数)配置为一个函数而不是一个对象。




Ext.define('MyApp.foo.Bar', function () {
    var id = 0;


    return {
        nextId: function () {
            return ++id;
        }
    };
}); 




      使用方法


a = Ext.create('MyApp.foo.Bar');


a.nextId();  // 结果:1
a.nextId();  // 结果:2  


 4、overrid已有类。overrid的内容是为了去扩展或者修改这个类。可以设置类的默认属性,或者重写它的方法,同样也可以重写静态的内容。


     常见用法 -- 设置默认属性 -- 构建一个具有基本内容或固定格式的 GridPanel




Ext.define('Wando.Base.Base', {
    extend: 'Ext.grid.GridPanel',
    requires: ['Ext.grid.GridPanel', 'Ext.ux.grid.FiltersFeature'],
    config: {
        columns: [{ xtype: 'rownumberer'}],
        loadMask: true,
        features: [{ ftype: 'filters', local: true}]
    },
    constructor: function (config) {
        config = config || {};
        Ext.applyIf(config, this.config);
        this.callParent([config]); /*与ExtJS 3.X版本不同*/
    },
    initComponent: function () {
        if (this.store) {
            this.bbar = Ext.create('Wando.PagerBar', { store: this.store });
        }
        this.selModel = Ext.create('Ext.selection.CheckboxModel', {});
        this.callParent();
    }
});


       常见用法 -- 重写方法




Ext.define('My.ux.CoolTip', {
  override: 'Ext.tip.ToolTip',


  constructor: function (config) {
    this.callParent(arguments); // calls Ext.tip.ToolTip's constructor
         //...
  }
}); 




      常见用法 -- 扩展或者重写 static




Ext.define('My.app.BarMod', {
  override: 'Ext.foo.Bar',


  statics: {
    method: function (x) {
      return this.callParent([x * 2]); // call Ext.foo.Bar.method
    }
  }
}); 

你可能感兴趣的:(extjs)