Extjs中RowExpander控件的默认展开问题示例探讨

在Ext JS中，`RowExpander` 是一个常用于在表格（如 `Ext.grid.Panel`）的每一行旁边添加一个可展开/折叠的面板的插件。默认情况下，`RowExpander` 控件下的行并不会自动展开，而是需要用户点击对应的展开按钮（通常是行左侧的箭头或小图标）来手动展开。

然而，如果你想让某些行在加载时就自动展开，可以通过编程的方式来实现。下面是一个简单的示例，展示如何在使用 `RowExpander` 的 `Ext.grid.Panel` 中实现默认展开特定行的功能。

### 示例代码

假设你已经有了一个基本的 `Ext.grid.Panel` 设置了 `RowExpander` 插件，你可以通过监听表格的 `viewready` 事件来在表格渲染完成后立即展开某些行。

Ext.create('Ext.grid.Panel', {
    title: 'Row Expander Example',
    width: 400,
    height: 300,
    store: yourStore, // 假设你已经有了一个Ext.data.Store
    columns: [
        // 定义你的列...
    ],
    features: [{
        ftype: 'rowexpander',
        // 展开行时显示的组件或配置
        expandOnEnter: true,
        rowBodyTpl: '<p>{someField}</p>' // 假设你有一个名为someField的字段
    }],
    listeners: {
        viewready: function(grid) {
            var view = grid.getView();
            // 假设我们想要默认展开第一行
            var firstRowIndex = 0;
            if (view.getNode(firstRowIndex)) {
                // 展开第一行
                grid.expandRow(firstRowIndex);
            }

            // 如果你想要基于某些条件展开多行，可以在这里添加逻辑
            // 例如，展开所有标记为"重要"的行
            // grid.store.each(function(record, index) {
            //     if (record.get('isImportant')) {
            //         grid.expandRow(index);
            //     }
            // });
        }
    },
    renderTo: Ext.getBody()
});

### 注意事项

- 在上面的代码中，`viewready` 事件是在表格的视图（即表格的DOM结构）准备好后触发的。此时，表格的每一行都已经被渲染，因此你可以安全地调用 `expandRow` 方法来展开行。

- `expandRow` 方法接受一个行索引作为参数，并展开对应索引的行。

- 如果你想要基于某些条件（如上例中的 `isImportant` 字段）来展开多行，可以在 `viewready` 事件的监听函数中遍历存储（store）并根据条件来展开行。

- 请确保 `yourStore` 已经被正确定义并赋值给表格的 `store` 配置项，且 `someField` 是你希望在展开的行中显示的字段名（根据实际情况修改）。