我正在使用 Ext.define() 以 ExtJS 的新 MVC 方式编写我的所有组件。
无论是在initComponent() 中定义属性还是像property: 42, 这样简单地设置属性，我都有些挣扎。
是否有被广泛接受的最佳实践？
我只是在必要时使用initComponent()（即，当我想要一些动态的东西或设置一个范围时），这让函数更短，让我免于一些丑陋的this.s 并始终使用它有好处，我永远不必将以前的属性移动到 initComponent() 只是因为我想让它更具动态性。
不幸的是，Sencha 的文档并没有详细说明这一点，而且可用的示例似乎可以按照他们的意愿行事。
【问题讨论】：
标签： javascript extjs extjs4
个人实践，我会在属性区声明变量的时候
x、y、width、height
title、saveBtnTxt、url、fields、iconCls
然后我将声明items、listeners、this.on、Ext.apply(me, {..}) 或任何需要 obj 范围的内容（this、me），以坐在我的initComponent 中。或者在一切设置之前应该修改/覆盖的东西，这样用户就不会通过覆盖一些重要的变量来破坏我的组件。
当然，这将作为我的指导。 2美分
编辑
关于丑陋的this，我在我的应用程序中广泛使用了变量me，它看起来比this干净很多。它也使我受益于不那么频繁地更改范围。
【讨论】：
me...我对 ExtJS 很陌生。
initComponent() 内部有很多拉动属性，这有点乏味。那么me 和this 除了更短之外还有什么区别吗？
我想在 Lionel 的回答中补充一点，最好在 initComponent 中声明任何 非原始 配置。 （原始我的意思是字符串、布尔值和数字）。数组和对象进入initComponent。
所以定义应该是这样的：
Ext.define('My.NewClass', {
extend: 'OldClass',
// here all primitive configs:
cls: 'x-my-cls',
collapsible: true,
region: 'west',
// and so on ...
initComponent: function() {
// here you declare non-primitive configs:
this.tbar = [/* blah-blah */];
this.columns = [/* blah-blah */];
this.viewConfig = {/* blah-blah */};
// and so on ...
this.callParent(arguments);
}
// other stuff
}
您应该将所有非原始配置放入 initComponent 的原因是，否则所有实例的配置将引用相同的对象。例如，如果您将 NewClass 定义为：
Ext.define('My.NewClass', {
extend: 'OldClass',
bbar: Ext.create('Ext.toolbar.Toolbar', {
// ...
所有实例的bbars 将引用同一个对象。因此，每次创建新实例时，bbar 都会从前一个实例中消失。
【讨论】：
initComponent() 会不会影响性能？顺便说一句，我是 extjs 的新手。谢谢
Ext.define('My.Group', {
// extend: 'Ext.form.FieldSet',
xtype : 'fieldset',
config : {
title : 'Group' + i.toString(),
id : '_group-' + i.toString()
},
constructor : function(config) {
this.initConfig(config);
return this;
},
collapsible: true,
autoScroll:true,
.....
});
你可以如下使用它。
handler : function() {
i = i + 1;
var group = new My.Group({
title : 'Group' + i.toString(),
id : '_group-' + i.toString()
});
// console.log(this);
// console.log(group);
Ext.getCmp('panelid').insert(i, group);
Ext.getCmp('panelid').doLayout();
}
【讨论】：
initComponent()。 :) 但是红绿灯很棒。