Extjs4中的xtype创建相同的id

Question

在extjs4中如果我有一个按钮如下:

Ext.define('Pandora.view.MyButton', {
extend: 'Ext.button.Button',
alias: 'widget.mybutton',
text: 'click me',
id: 'butid'

});

如果我在视口中使用它如下:

                    {
                      xtype: 'panel',
                      id: 'panelid',
                      title: 'One tab',
                      html: '<p>what is this </p>'
                    },
                    {
                      xtype: "mybutton"

                    },
                    {
                      xtype: "mybutton"
                    }

这将创建两个具有相同id的按钮(建议不是W3C),它可能会产生奇怪的行为.为了在应用程序中多次重复使用相同的按钮,建议使用xtype而不提供id(在这种情况下,Extjs将自己创建).

Answer 1

这将创建两个具有相同ID的按钮

是的,这适用于您的情况,因为您在创建类时已经对id配置进行了硬编码

Ext.define('Pandora.view.MyButton', {
    extend: 'Ext.button.Button',
    alias: 'widget.mybutton',
    text: 'click me',
    id: 'butid'     <=========
});

来自ExtJS4文档:

请注意,此id还将用作包含HTML元素的元素id,该元素将呈现给此组件的页面.这允许您编写基于id的CSS规则以唯一地设置此组件的特定实例的样式,并且还可以使用此组件的id作为父项来选择子元素.

参考: http ://docs.sencha.com/ext-js/4-0/#!/api/Ext.button.Button