在 extjs 中选择字段答案

【问题标题】：select field in extjs在 extjs 中选择字段
【发布时间】：2018-03-24 13:57:18
【问题描述】：

我正在使用 extjs 6.5.3 试用版，我想创建一个选择字段，但它不起作用我的代码是这样的（带有按钮和选择字段的工具栏）

                        {
                          xtype : 'button',
                          text  : 'Next',
                          iconCls : 'x-fa fa-arrow-circle-right',
                          handler : function () {
                              Ext.getCmp('employeescheduler').shiftNext();
                          }
                      },{
                           xtype: 'selectfield',
                           label: 'Choose one',
                           options: [{
                                text: 'First Option',
                                value: 'first'
                            }]
                      }

但它显示了一个错误：

Error: [Ext.create] Unrecognized class name / alias: widget.selectfield

我试图要求它但没有结果

requires : [
    'Sch.examples.externaldragdrop.view.MainView',
    'Ext.field.Select'
],

【问题讨论】：

标签： javascript extjs

【解决方案1】：

您必须将商店绑定到组合框：

小提琴：https://fiddle.sencha.com/#view/editor&fiddle/2es4

        Ext.create('Ext.form.field.ComboBox', {
           renderTo: Ext.getBody(),
           fieldLabel: 'Select an option',
           store: Ext.create('Ext.data.Store', {
               fields: ['optionName', 'value'],
               data: [
                    {
                        value: 1,
                        optionName: 'First Option'
                    },
                    {
                        value: 2,
                        optionName: 'Second Option'
                    },
                    {
                        value: 3,
                        optionName: 'Third Option'
                    }
                ]
           }),
           emptyText: 'Select...',
           displayField: 'optionName',
           valueField: 'value'
        });

【讨论】：

【解决方案2】：

extjs 使用组合框，组合 xtypes 用于选择框，所以只需使用

      {
                       xtype: 'combo',
                       label: 'Choose one',
                       options: [{
                            text: 'First Option',
                            value: 'first'
                       }]
      }

【讨论】：

我试过了，但它显示给我一个没有任何选项和标签的空组合
啊，那是因为您不应该使用选项，而应该使用存储。看起来很尴尬，但它是 extjs
store: Ext.create('Ext.data.Store', { fields: ['text', 'value'], data : [ {"text":"first option", "value":"first"}, ...... ] });