时间戳

首页 > 解决方案 > Modern 7.0 ComboBox 在每次值更改时触发“选择”事件

extjs - Modern 7.0 ComboBox 在每次值更改时触发“选择”事件

问题描述

每次输入更改时，现代中的组合框都会触发“选择”事件。这与经典有很大不同。这样一来，就无法区分用户进行选择和务实地设置字段的值。

这在 Sencha 论坛中被报告为一个错误：

https://www.sencha.com/forum/showthread.php?468730-Modern-6-5-2-ComboBox-fires-select-event-on-every-value-change

上面的链接还包含一个提琴手来演示这个问题。

有没有人遇到过这个问题，你是如何克服的？

标签： extjsextjs6-modernextjs7

解决方案

forceSelection: true将有助于解决此问题，但在不需要强制选择的情况下不会取消错误

编辑：

这种行为是由于方法syncValue（在这个源中搜索- 方法是私有的并且没有文档）

我不明白为什么组件开发人员选择创建一个记录，即使它不存在。

来自源文件的评论：

要么用户输入了一些东西（isInput），要么我们有一个 setValue 到一个在商店中没有匹配的值，我们不是 forceSelection: true。我们创造了一个新的记录。

我建议使用以下覆盖来修复此行为：

小提琴

Ext.define('Ext.field.SelectOverride', {
    override: 'Ext.field.Select',
    autoCreateRecord: false,
    syncValue: function() {
        var me = this,
            store = me.getStore(),
            forceSelection = me.getForceSelection(),
            valueNotFoundText = me.getValueNotFoundText(),
            is, isCleared, isInput, value, matchedRecord;


        if (me.reconcilingValue || !store || !store.isLoaded() || store.hasPendingLoad()) {
            return;
        }

        me.reconcilingValue = true;

        me.getSelection(); // make sure selection config is flushed

        is = {};
        is[me.syncMode] = true;
        value = ((isInput = is.input || is.filter)) ? me.getInputValue() : me.getValue();
        isCleared = value == null || value === '';


        if (!isCleared) {
            if (me.getMultiSelect()) {
                return me.syncMultiValues(Ext.Array.from(value));
            }

            matchedRecord = (isInput ? store.byText : store.byValue).get(value);

            if (matchedRecord) {
                if (!matchedRecord.isEntity) {

                    matchedRecord = matchedRecord[0];
                }
            }
            else if (!forceSelection) {
                matchedRecord = me.findRecordByValue(value);
            }
        }

        // Either user has typed something (isInput), or we've had a setValue
        // to a value which has no match in the store, and we are not forceSelection: true.
        // We create a new record.
        if (!isCleared && !matchedRecord && !forceSelection && me.autoCreateRecord) {
            matchedRecord = me.createEnteredRecord(value);
        }
        else {
            if (isInput || is.store) {
                if (!matchedRecord && forceSelection) {
                    me.setValue(null);
                    me.setSelection(null);

                    if (!is.filter) {
                        me.setFieldDisplay();
                    }
                }
            }            else {
                if (isCleared) {
                    if (me.mustAutoSelect()) {
                        matchedRecord = store.first();

                        if (me.getAutoSelect() === 'initial') {
                            me.setAutoSelect(false);
                        }
                    }
                    else {
                        me.setSelection(null);
                    }
                }
                else if (!matchedRecord && valueNotFoundText) {
                    me.setError(valueNotFoundText);
                }
            }
        }

        if (matchedRecord) {
            me.setSelection(matchedRecord);
        }

        me.reconcilingValue = false;
    }
});

推荐阅读