css - ExtJS 组合框无法正确呈现

Question

我在使用 ExtJS 6.2 的管理仪表板模板的表单面板中有以下字段集:

    {
        xtype: 'fieldset',
        layout: 'anchor',
        items: [{
            xtype: 'combobox',
            listeners : {
                select : function() {
                    console.log(arguments)
                    console.log(arguments[1].data.birth_date)
                    console.log(arguments[1].data.first_name)
                    console.log(arguments[1].data.last_name)
                    console.log(arguments[1].data.sex)
                }
            },
            bind: {
                store: '{patients}'
            },
            reference: 'patientCombo',
            publishes: 'id',
            fieldLabel: 'Patient Search',
            displayField: 'mrn',
            //anchor: '-',
            // We're forcing the query to run every time by setting minChars to 0
            // (default is 4)
            minChars: 2,
            queryParam: '0',
            queryMode: 'local',
            typeAhead: true,
            // https://www.sencha.com/forum/showthread.php?156505-Local-combobox-with-any-match-filter
            doQuery: function(queryString, forceAll) {
                this.expand();
                this.store.clearFilter(!forceAll);

                if (!forceAll) {
                    this.store.filter(this.displayField, new RegExp(Ext.String.escapeRegex(queryString), 'i'));
                }
            }


        }, {
            // https://www.sencha.com/forum/showthread.php?299301-Bind-combobox-displayField-value-to-displayfield
            xtype: 'displayfield',
            fieldLabel: 'Selected Patient',
            bind: {
                html: '<p>Name: <b>{patientCombo.selection.first_name}, ' +
                '{patientCombo.selection.last_name} </b></p>' +
                '<p>Sex: {patientCombo.selection.sex}</p>' +
                '<p>Birthdate: {patientCombo.selection.birth_date}</p>'
            }


        }]
    },

它工作正常，但渲染起来很奇怪，如下图所示(我不得不屏蔽显示的数据，但数字是要从组合框中选择的内容):

我假设这是一个 CSS 问题，但无法弄清楚是什么。注意:在创建模板后，我必须将 Admin-all.css Admin-all_1.css Admin-all_2.css 和 Admin-all_3.css 从 build/examples/admin-dashboard/classic/resources 文件夹复制到应用程序为了解决一个主要的布局问题。

Answer 1

是的，这是一个 CSS 问题。 Admin Dashboard 示例及其 CSS 已使用 Sencha Cmd 编译，因此 CSS 文件仅包含示例所需的样式。由于示例中没有组合框，因此未添加组合框样式，您插入的组合框无法正确呈现。

唯一的解决方案是使用 Sencha Cmd 从源代码重新编译并修复布局问题，我猜这是由于缺少 requires 指令造成的。