Ext4.2 RowExpander无法触发事件解决办法

在基于 ExtJS 4.2 进行项目开发时，许多开发者都会遇到一个棘手的问题：Ext.grid.plugin.RowExpander 插件在官方文档中明确列出了 collapsebody 和 expandbody 事件，然而实际绑定后却始终无法触发。社区中流传的各种方案——例如重写 init 方法或 toggleRow 方法——往往也无济于事。问题的症结究竟在哪里？如何正确解决？本文将为您详细解析。

问题根源：源码中并未定义这两个事件

直接查看 Ext.grid.plugin.RowExpander 的源代码可以发现，该插件并未声明 collapsebody 和 expandbody 事件。即使按照网上常见的做法重写 init 和 toggleRow 方法，依然无法让这两个事件生效——因为事件根本没有被挂载到正确的对象上。

解决方案：让 Grid 对象直接承载事件

既然插件本身没有提供事件接口，我们可以主动为 Grid 对象添加这两个事件。核心思路如下：

• 在 Grid 配置中直接定义 listeners，监听 expandbody 和 collapsebody；
• 重写 Ext.grid.plugin.RowExpander 的 toggleRow 方法，在行展开或折叠时手动触发 Grid 上的这两个事件。

这种方案既保留了插件的全部原有功能，又能让事件回调正常运作，代码改动量极小，可谓一举两得。

具体实现（附完整测试代码）

以下是一份可直接运行的测试代码，关键部分已用注释标注。请特别留意 Ext.override 中对 toggleRow 的改写，以及最后 Grid 配置中的 listeners。