组合框是否需要数据存储

Is data Store required for Combobox?

本文关键字:数据 存储 是否 组合      更新时间:2023-09-26

用数据填充组合框是否需要数据存储?在查看了文档后,它看起来是这样的,但我想确认一下,因为我是ExtJS的新手。

选择列表的选项由任何Ext.data.Store(包括远程存储)填充。存储中的数据项分别通过valueField和displayField配置映射到每个选项的显示文本和支持值。-http://docs.sencha.com/extjs/4.0.7/#/api/Ext.form.field.ComboBox

我在一个表格中有几个组合框;所有这些都将包含不同的选项。这是否意味着我必须为每个组合框创建一个数据存储?

Ext.onReady(function() {
    console.clear();
    Ext.create('Ext.data.Store', {
        storeId: 'confiurationDetailsStoreForRead',
        fields: ['value', 'name'],
        data: [{
            "value": "72001",
            "name": "Enabled"
        }, {
            "value": "72002",
            "name": "Disabled"
        }, {
            "value": "72003",
            "name": "Required"
        }]
    });
    var configurationDetailsPanel = Ext.create({
        xtype: 'form',
        url: '/employeeSearchResult',
        items: [{
            xtype: 'combobox',
            fieldLabel: 'Config Type',
            store: Ext.getStore('confiurationDetailsStoreForRead'),
            queryMode: 'local',
            displayField: 'name',
            valueField: 'value'
        }],
        buttonAlign: 'left',
        buttons: [{
            text: 'Search',
            handler: function() {
                console.log('Search Pressed');
            }
        }, {
            text: 'Reset',
            handler: function() {
                this.up('form').getForm().reset();
            }
        }]
    });
    //Main Container
    Ext.create({
        xtype: 'panel',
        renderTo: Ext.getBody(),
        defaultType: 'button',
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        items: [configurationDetailsPanel]
    });
});

上面的代码是我表单中一个组合框的例子。我想知道是否有任何方法可以将数据放在组合框配置中(而不是创建一个存储,然后在配置中引用该存储)?还是我在上面的代码中使用的方法是唯一的方法?

提前谢谢。

是!你可以把商店直接放在组合框中:

                {
                xtype: 'combobox',
                fieldLabel: 'Config Type',
                displayField: 'name',
                queryMode: 'local',
                store: {
                    fields: [
                        'value',
                        'name'
                    ],
                    data: [
                        {
                            value: '72001',
                            name: 'Enabled'
                        },
                        {
                            value: '72002',
                            name: 'Disabled'
                        },
                        {
                            value: '72003',
                            name: 'Required'
                        }
                    ]
                },
                valueField: 'value'
            }

也可以这样做

    {
        xtype: 'combobox',
        fieldLabel: 'Config Type',
        queryMode: 'local',
        store: [ 
            [ '72001', 'Enabled' ], 
            [ '72002', 'Disabled' ], 
            [ '72003', 'Required' ] 
        ]
    }