如何更改 extJS 组合下拉列表中的数据？

Question

我有组合框，我正在尝试加载数据。我想为某些 Reg 表达式清理我的数据。

这是我的 Stroe 代码。

Ext.define("MyApp.store.combo.country", {
    extend: "Ext.data.Store",
    alias:"widget.country",
    //autoLoad:true,
     fields: [{
            name: 'name',type:'string'
        },{
            name: 'key',type:'int'
        }],
    proxy: {
        type: 'ajax',
        method: 'GET',
        url: '/myCountry/getName',
        reader: {
            type: 'json'                
        }
    },
    listeners: {
        beforeload ( store, operation, eOpts ) {
            console.log("combo before load");
        },

        load: function (_this, records, successful, operation, eOpts) {
            var length = records.length;
            var htmlRegex = new RegExp("<(\"[^\"]*\"|'[^']*'|[^'\">])*>");
            for(var i=0; i<length; i++){
                if(htmlRegex.test(records[i].data.name)){
                    records[i].data.name = records[i].data.name.replace( /(<([^>]+)>)/ig, '');
                }
            }
        }
     }
});

现在，当我单击 COmbobox 时，我看不到下拉列表中的数据已清理（不通过 RegExp 执行）。这是第二次工作正常。

所以我的问题是在这种情况下如何更改我的数据。

我已经尝试过，您可以在加载方法中看到。（即使在加载方法之前也没有任何反应。）

任何解决方法

Answer 1

我认为最好的方法是使用 calculate 功能。

这确保每次加载或更改商店中的记录时，都会进行正则表达式验证。唯一的缺点是你有另一个字段。

Ext.define("MyApp.store.combo.country", {
    extend: "Ext.data.Store",
    alias: "widget.country",
    fields: [{
        name: 'regexedName',
        type: 'string',
        calculate: function (data) {
            const htmlRegex = new RegExp("<(\"[^\"]*\"|'[^']*'|[^'\">])*>");

            if (htmlRegex.test(data.name)) {
                return data.name.replace(/(<([^>]+)>)/ig, '');
            } else {
                return data.name;
            }
        }
    }, {
        name: 'name', type: 'string'
    }, {
        name: 'key', type: 'int'
    }],
    proxy: {
        type: 'ajax',
        method: 'GET',
        url: '/myCountry/getName',
        reader: {
            type: 'json'
        }
    }
});

Answer 2

您可以详细说明在所需字段上定义 convert or the calculate 配置的值，这样您就可以完全避免处理商店侦听器。

主要区别在于第一个让您快速转换字段的值，而最后一个让您可以根据其他记录信息的详细说明创建新的 property/field。

    // Example *convert* to change the case of a property
    {
        name: 'firstName',
        type: 'string',
        convert: function (value) {
            return value.toUpperCase();
        }
    }

    // Example *calculate* to create the new property "fullName" based on other properties
    {
        name: 'fullName',
        type: 'string',
        convert: function (data) {
            return data.firstName + ' ' + data.lastName;
        }
    }

如何更改 extJS 组合下拉列表中的数据？

How to change the data in extJS combo dropdown?

javascript

extjs

combobox

extjs6