Ext JS Tips

callParent() 优化

调用父类方法，如

Ext.define('App.view.MyPanel', {
        extend: ‘Ext.panel.Panel’,
        onRender: function (parentNode, index) {
                this.callParent(arguments);
        }
});

其中 this.callParent 等价于 Ext.panel.Panel.prototype.onRender.apply(this, arguments);，而且后者效率更高。如果用 Sencha Cmd 5 打包会优化替换。

Ext.Ajax.extraParams = { foo: “bar” }; 已废弃

5 开始废弃，改用 setter 方法：

Ext.Ajax.setExtraParams({
        foo: "bar"
});

MouseEnter 事件比 MouseOver 事件更节省资源

如果你的事件只是希望可以首次进入区域便可以的触发的，那么不需要 MouseOver。MouseOver 会反复被触发。

例子：https://fiddle.sencha.com/#fiddle/43q

注意创建实例不应用在类定义上

如下，左边是错误的，右边是正确的

Ext.define(‘MyApp.view.Main’, { extend : ‘Ext.container.Container’, xtype : ‘myapp-main’, requires : [ ‘MyApp.plugins.Foo’ ], items : [ Ext.create(‘Ext.Component’, { html : ‘Hello’ }) ], plugins : [ Ext.create(‘MyApp.plugins.Foo’) ] });

Ext.define(‘MyApp.view.Main’, { extend : ‘Ext.container.Container’, xtype : ‘myapp-main’, requires : [ ‘MyApp.plugins.Foo ], items : [ { xtype : ‘component’, html : ‘Hello’ } ], plugins : [ { ptype : ‘myapp-foo’ } ] });

原因是 prototype 继承链，左边的只能使用一次。