键入时,组合框值正在消失

Question

使用extjs 5.1.3版本.我有一个typeAhead组合框,格式如下:

Combobox商店:

Ext.define('MyApp.view.myobj.field.CustomObject', {
    extend:'Ext.form.field.ComboBox',
    xtype: 'cstmObject',
    requires: [
        'MyApp.model.myobj.CustomObject'
    ],
    fieldLabel: 'Custom Object Name',
    displayField: 'name',
    valueField: 'name',
    queryMode: 'remote',
    selectOnFocus: false,
    typeAhead: true,
    hideTrigger: true,
    minChars: 1,
    queryCaching : false,
    store:{
        model: 'MyApp.model.myobj.CustomObject'
    }
}

以下是表格摘录:

{
    xtype: 'cstmObject',
    fieldLabel: 'Custom Object Name',
    allowBlank: false,
    maxLength: 5,
    enforceMaxLength: true,
    bind: '{customObject.row}'
}

在组合框中键入值时,有时显示下拉值,有时不显示输入.当我观察网络​​面板时,存储正在从服务器正确加载.

当存储从服务器正确加载时,没有显示下拉值的客户端问题可能是什么？

更新:我找到了问题的模式,即如果在下拉列表中找到具有类型值的记录的完全匹配,则只有下拉值消失.(例如,如果我输入字母A,如果有一个值为A的记录,则下拉值正在消失.如果我键入a,则下拉列表将不会消失,因为没有带小写字母a的记录).

我需要提供哪些必要的配置才能解决此问题？

Answer 1

看来这是 Ext 5.1 中的一个错误

仅当组件绑定到模型时才会发生这种情况。

这是Fiddle来重现这个问题。输入A您将看到结果，当您输入A1（商店中存在）时，结果将被隐藏。

在 Ext 5 论坛中记录了一个错误

更新

这是我想出的一个修复方法。

Ext.define('MyApp.overrides.form.field.ComboBox', {
    override: 'Ext.form.field.ComboBox',

    /**
     * Fix for EXTJS-19274
     */
    setValue: function(value) {
        var me = this;

        // This is the value used to forceSelection in assertValue if an invalid value is left
        // in the field atcompleteEdit. Must be cleared so that the next usage of the field
        // is not affected.
        me.lastSelectedRecords = null;

        // Value needs matching and record(s) need selecting.
        if (value != null) {
            // Only go through text/record matching if there's a change.
            if (value !== me.getRawValue()) {
                me.doSetValue(value);
            }
        }
        // Clearing is a special, simpler case.
        else {
            me.suspendEvent('select');
            me.valueCollection.beginUpdate();
            me.pickerSelectionModel.deselectAll();
            me.valueCollection.endUpdate();
            me.resumeEvent('select');
        }
        return me;
    }
});