SAPUI5：如何向 ui.table 的列菜单添加自定义功能？

Question

我想让我的用户有机会在将数据加载到表格后重新格式化表格单元格。我认为一个巧妙的方法是在列菜单中添加功能。因此，当单击表格列时，菜单会附加标准的“过滤、排序”，但还有一个称为“格式”的行，它提供了一些选项（例如，将数字单元格从 55555,55 格式化为 55.555,55）

很遗憾，我无法找到向列菜单添加新行的方法。我的排序和过滤是这样添加的：

oTable.bindColumns("/columns", function(index, context) {
    var columnName = context.getObject().columnId;
    return new sap.ui.table.Column({
        label:columnName,
        template: columnName,
        sortProperty: columnName,
        filterProperty: columnName,
    });
});

如何向列菜单添加新的行/功能？

更新

这是我的表格在 xml 视图中的样子：

 <table:Table id="uploadData" visibleRowCountMode="Auto" rowSelectionChange="tableRowSelectionChange" enableCellFilter="true" fixedColumnCount="0" enableBusyIndicator="true" customData="{Type: 'sap.ui.core.CustomData', key:'table-style-type', value:'custom-styled',  writeToDom: true }">
        <table:extension>
                <m:Button icon="sap-icon://download" press="onDataExportXLS" align="Right" />
        </table:extension>

        <table:columns>
                <!-- Columns dynamically created in controller -->
        </table:columns>
        <table:rows>
                <!-- Rows created in controller -->
        </table:rows>
</table:Table>

Answer 1

sap.ui.table.Column 有一个名为 menu 的聚合，仅用于此目的。它接受单击列时显示的任何自定义菜单项。此聚合由sap.ui.unified.Menu 控制。

在MenuItem聚合的select函数中，可以编写函数来处理选择菜单项时需要做的事情

sap.ui.table.Column documentation

sap.ui.unified.Menu documentation

在this sample here和its code here查看，点击数量栏，你会看到一个我的自定义菜单项

这里的 XML 代码的 sn-p，

<Column id="quantity" width="6rem" hAlign="End" sortProperty="Quantity">
    <m:Label text="Quantity" />
    <template>
        <m:Label text="{ path: 'Quantity', type: 'sap.ui.model.type.Integer'}" />
    </template>
    <menu>
        <u:Menu ariaLabelledBy="quantity">
            <u:items>
                <u:MenuItem text="My custom menu entry" select="onQuantityCustomItemSelect" />
                <u:MenuItem text="Sort" select="onQuantitySort" icon="sap-icon://sort" />
            </u:items>
        </u:Menu>
    </menu>
</Column>

JS中的代码，

var oColumn = new sap.ui.table.Column({
    label: "Some column Name",
    menu: new sap.ui.unified.Menu({
        items: [new sap.ui.unified.MenuItem({
            text: "My custom menu",
            select: function (oEvent) {
                pressEventOnItem(oEvent);
            })
        ]
    })
})