Context

不久前我用过这个answer https://stackoverflow.com/a/19198773/1842261实现远程排序和过滤。使用“关联模型.关联模型字段”格式，我可以轻松解析服务器端代码中的表达式以查询数据库。

Problem

虽然这完成了工作，但我遇到了另一个问题grouping- 我已将其配置为本地 -相关型号。如果我对显示关联字段的列进行分组，则无法在没有错误的情况下折叠或展开。对网格的根模型执行相同的操作不会引发任何错误。

该问题可以在此重现fiddle https://fiddle.sencha.com/#fiddle/1f5q.

控制台日志中的错误跟踪如下所示：

ext-all-debug.js:198133 Uncaught TypeError: Cannot read property 'isModel' of undefined

getMetaGroup            @   ext-all-debug.js:198133
doCollapseExpand        @   ext-all-debug.js:198284
collapse                @   ext-all-debug.js:198207
onGroupClick            @   ext-all-debug.js:198380
fire                    @   ext-all-debug.js:20223
doFireEvent             @   ext-all-debug.js:21130
doFireEvent             @   ext-all-debug.js:64732
prototype.doFireEvent   @   ext-all-debug.js:54757
fireEventArgs           @   ext-all-debug.js:20983
fireEvent               @   ext-all-debug.js:20942
processSpecialEvent     @   ext-all-debug.js:188549
processItemEvent        @   ext-all-debug.js:188499
processUIEvent          @   ext-all-debug.js:168108
handleEvent             @   ext-all-debug.js:168061
fire                    @   ext-all-debug.js:20223
fire                    @   ext-all-debug.js:32463
publish                 @   ext-all-debug.js:32439
doDelegatedEvent        @   ext-all-debug.js:32489
onDelegatedEvent        @   ext-all-debug.js:32476
(anonymous function)    @   ext-all-debug.js:6662
  

在代码中我使用了上面提供的解决方案，并且还申请了分组功能。它不是完全干净的代码，但只要我尊重修复的限制，它就可以工作。

我应该如何解决这个问题？根据问题的类型，我认为这意味着重写整个分组机制，但我不喜欢那样！

我偶然找到了我的问题的答案。上官方文档网站 http://docs.sencha.com/extjs/6.2.0/classic/Ext.grid.feature.Grouping.html，这一行告诉你要做什么：

但是，如果您打算按复杂数据的数据字段进行分组 类型如Object或Array，需要定义一个或多个 Ext.util.Grouper 上可用于查找的功能 按不同字段分组时的内部组信息。

因此，您需要在分组功能的“groupers”配置中定义一个数组：

 features: [{
            ftype: 'grouping',
            remoteRoot: 'Summary',
            groupHeaderTpl: '{name}',
            collapsible: true,
            groupers:  [{
                          property: 'Customer.Address',
                          groupFn: function (val) {
                             return val.data.Job ? val.data.Customer.Address: '';
                        }
               }]
            }]

如果您在此列上进行分组，则将使用 groupFn 进行实际分组。