现代 7.0 ComboBox 在每次值更改时触发 'select' 事件

Question

现代的组合框在每次输入更改时都会触发 "select" 事件。这与经典有很大不同。这样做就无法区分用户进行选择和实际设置字段的值。

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

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

上面的 link 还包含一个 fiddler 来演示这个问题。

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

Answer 1

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

编辑：

此行为是由于方法 syncValue（在此 source 中搜索 - 方法是私有的并且没有文档）

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

来自源文件的注释：

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.

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

fiddle

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;
    }
});

现代 7.0 ComboBox 在每次值更改时触发 'select' 事件

Modern 7.0 ComboBox fires 'select' event on every value change

extjs

extjs6-modern

extjs7