ExtJS 6.2:为网格列创建自定义过滤器

ExtJS 6.2 : creating a custom filter for a gridcolumn

我想为我的网格列创建自定义过滤器。

我试过这个:

Ext.define('Myapp.grid.filters.filter.Float', {
  extend : 'Ext.grid.filters.filter.Number',
  alias  : ['grid.filter.float'],

  type : 'float',

  config : {
    serializer : function (f) {
      return {
        type     : 'float',
        value    : f.value,
        property : f.property,
        operator : f.operator
      };
    }
  }
});

然后我尝试在我的网格列中使用过滤器:

   {
      header     : 'Foo',
      dataIndex  : 'bar',
      filterable : true,
      filter     : {
        type : 'float'
      }
    }

如何在我的应用程序中创建、添加或注册过滤器到 gridfilter-插件?我真的不明白。

提前致谢

解决方案:

我们使用 Ext.grid.filters.filter.Base 中的 createFilter 函数来创建和使用过滤器:

Ext.define('MyApp.foo.bar.FloatFilter', {
  extend : 'Ext.grid.filters.filter.Number',
  alias  : 'grid.filter.float',

  createFilter : function (config, key) {
    config.type = 'float';
    return this.callParent(arguments);
  }

});

要添加新的过滤器类型,您必须定义新的 class,从 Ext.grid.filters.filter.Base 或其后代扩展而来(就像您所做的那样)。

检查此 simple example

此外,您可以检查现有的过滤器代码以了解如何添加自定义菜单或过滤器规则,例如 Ext.grid.filters.filter.String based onf Ext.grid.filters.filter.SingleFilter