ExtJS 6 带清除功能的 Combobox 实现示例

下面是一个实现带清除功能的 Combobox 的示例代码：

Ext.define('MyApp.view.ClearableComboBox', {
    extend: 'Ext.form.field.ComboBox',
    alias: 'widget.clearablecombobox',
    
    triggers: {
        clear: {
            cls: 'x-form-clear-trigger',
            handler: function() {
                this.setValue('');
            }
        }
    },
    
    onRender: function() {
        this.callParent(arguments);
        this.triggerEl.setStyle('height', 'auto');
    }
});

在这个示例中，我们定义了一个名为'ClearableComboBox'的类，它继承自'Ext.form.field.ComboBox'，同时定义了一个别名为'clearablecombobox'。我们使用了'triggers'属性来定义一个名为'clear'的触发器，该触发器的样式为'x-form-clear-trigger'，点击该触发器时会将控件的值设置为空。我们还覆盖了'onRender'方法，将触发器的高度设置为自动以便适应不同尺寸的 Combobox。最后，在页面中使用'clearablecombobox'控件即可。