Checkbox 当我在复选框组上设置id时，复选框组将消失

我试图在ExtJS中创建一个简单的工具栏，其中包含一个复选框组和一个按钮，它工作得很好，但是当我尝试为我的复选框组提供一个id时，整个工具栏不再显示。 这是我的密码：

Ext.define
(
    'CMS.view.TreeGrid.Filters',
    {
        extend: 'Ext.form.Panel', 
        title: 'Filters',
        layout: 'fit',
        alias: 'widget.filters',
        bodyPadding: 10,
        renderTo: Ext.getBody(),
        vtype: 'hbox',
        items :
        [
            {
                xtype: 'toolbar',
                vtype: 'vbox',
                items:
                [

                    {
                        xtype: 'checkboxgroup',
                        //id: 'propertiesCBG',
                        fieldLabel: 'Properties',
                        vertical: true,
                        layout: 'fit',
                        items: 
                        [
                            { boxLabel: 'id',           name: 'rb', inputValue: '1' },
                            { boxLabel: 'State',        name: 'rb', inputValue: '2', checked: true },
                            { boxLabel: 'headline',     name: 'rb', inputValue: '3' },
                            { boxLabel: 'severity',     name: 'rb', inputValue: '4' },
                            { boxLabel: 'country',      name: 'rb', inputValue: '5' },
                            { boxLabel: 'hasRelated',   name: 'rb', inputValue: '6' }
                        ]
                    },
                    {
                        xtype: 'button',
                        text: 'Request',
                        id: 'requestButton',
                    },
                ]
            }
        ]
    }
);

当行“id:propertiescb”被注释时，我没有任何问题，工具栏显示为我希望它显示的样子，但我需要复选框组的id才能在控制器上获取其值。

---

请帮帮我，我只是不明白问题出在哪里。

您是否尝试过将id临时更改为其他内容，以确认您的项目中其他地方没有重复的id

          xtype: 'checkboxgroup',
          id: 'propertiesCBG_temp',
          fieldLabel: 'Properties',

---

当两个组件具有相同的id时，我看到了类似的行为。

最后，我似乎在两个不同的视图中调用了我的工具栏，因此我猜这造成了与id的冲突。我将找到另一种方法来重用我的工具栏。

一般来说，使用id属性是一种不好的做法。如果您必须具有某种id，请使用itemId，它将不具有任何类型的全局唯一性约束，并且允许您在选择器中使用#

人们通常使用ID来轻松获取对组件的引用，例如： Ext.ComponentQuery.query（'#myid'）

你真正应该做的是：

Ext.ComponentQuery.query（'filters checkboxgroup'）

以获取对您的checkboxgroup的引用

在您的情况下，将控制器中的选择器更改为“filters checkboxgroup”，您应该会没事。请注意，如果您的应用程序中有多个过滤器，请为选择器添加更多特性，例如，如果您的过滤器组件是特定面板的子组件：

---

Ext.ComponentQuery.query（'panel1 filters checkboxgroup'）

是的，我的id首先是“properties”，我想它可能是extjs上预先存在的id，这就是为什么我将其更改为“propertiesCBG，它是唯一的，我的代码实际上很短。如果ID之间存在冲突，ExtJs会在控制台中发出警告。使用ChromeDevTools，您会立即注意到此类错误。