如何在sap.ui.Table中实现默认分组并从控制器触发分组？

问题背景 #

需要在sap.ui.table.Table中实现默认分组功能，无需手动点击列标题菜单开启。已知enableGrouping属性已被SDK标记为弃用，但仍可部分生效；且无法替换为sap.m.Table，需求要求列具备多标签、筛选和排序功能。

测试视图代码：

<mvc:View controllerName="ns.project1.controller.View1" xmlns="sap.ui.table" xmlns:m="sap.m" xmlns:mvc="sap.ui.core.mvc">
    <m:Page id="page" title="{i18n>title}">
       <Table
            enableGrouping="true" 
            groupBy="Name"
            rows="{Model>/ProductCollection}">
            <columns>
                <Column width="11rem" id="idMyColumn" sortProperty="Name" filterProperty="Name">
                    <m:Label text="Product Name" />
                    <template>
                        <m:Text text="{Model>Name}" wrapping="false" />
                    </template>
                </Column>
                <Column width="11rem">
                    <m:Label text="Product Id" />
                    <template>
                        <m:Input value="{Model>ProductId}"/>
                    </template>
                </Column>
            </columns>
        </Table>
    </m:Page>
</mvc:View>

测试截图：

• 初始状态：
• 列菜单：
• 开启分组后：

解决方案 #

方法1：调用表格的addGrouping方法（推荐） #

虽然enableGrouping已弃用，但UI5仍提供官方分组API主动触发分组。在控制器的onInit或数据加载完成的回调中，获取表格实例并调用addGrouping方法指定分组字段：

onInit: function() {
    // 获取表格实例，替换为你实际的表格ID
    const oTable = this.byId("yourTableId"); 
    // 绑定数据加载完成事件，确保数据就绪后再分组
    const oBinding = oTable.getBinding("rows");
    oBinding.attachDataLoaded(() => {
        // 添加分组配置
        oTable.addGrouping({
            property: "Name", // 对应需要分组的字段名
            ascending: true // 可选，控制分组排序方向
        });
    });
}

方法2：修正groupBy属性的使用 #

视图中设置的groupBy="Name"未生效，是因为enableGrouping弃用后该属性的触发逻辑已变更。结合addGrouping方法可让groupBy配置生效，或直接通过API完全替代视图中的分组配置。

注意事项 #

• 必须确保表格的rows绑定已加载完成数据，否则分组逻辑可能不生效，因此建议在dataLoaded事件回调中执行分组操作。
• 如需取消分组，可调用removeAllGroupings或removeGrouping方法。

内容的提问来源于stack exchange，提问作者Pablo Sinder