Sapui5 如何在sap.m.Table中实现多级合并？

我想在sap.m.Table中实现多级合并。我试图在第二列中添加

mergeDuplicates=“true”

，但结果如下：

很奇怪。我将第一列的数据添加到第二列：

，拆分看起来像我想要的，但是如何隐藏

{name}

数据

在中进行了一些研究，发现

mergeFunctionName

您可以在“#”符号后向给定函数传递一个字符串参数。e、 g.“数据#myparameter”：

---

我可以将{name}和{amount}传递给

myparameter

函数吗

使用mergeNameFunction是一种很好的方法：）您可以使用任何将强制进行比较的绑定内部方法

例如

---

使用mergeNameFunction将不会进行其他修改。

使用mergeNameFunction是一种很好的方法：）您可以使用任何强制比较的绑定内部方法

例如

---

无需其他修改即可工作。根本原因是您应该为绑定正确定义

分拣机

items="{
        path: '/',
        sorter: [{
                   path: 'name', 
                   descending: false,
                   group:true
                 }, {
                   path: 'amount', 
                   descending: false,
                   group:true
                }]
       }"

根本原因是您应该为绑定正确定义
分类器

items="{
        path: '/',
        sorter: [{
                   path: 'name', 
                   descending: false,
                   group:true
                 }, {
                   path: 'amount', 
                   descending: false,
                   group:true
                }]
       }"

为了创建一个属性，我们可以在其中添加一个属性来保存这样的主键，该主键可以由一个getter函数自动访问，我们扩展了文本控件，如下所示


sap.ui.define(
['sap/m/Text']，
功能（文本）{
返回Text.extend（“namespace.controls.MergableText”{
元数据：{
特性：{
合并相关：{
键入：“字符串”，
默认值：“
}
}
},
渲染器：函数（oRm、oControl）{
sap.m.textrender.render（oRm，oControl）；//使用超级类渲染器例程
}
});
}
);为了创建一个属性，我们可以在其中添加一个属性来保存这样的主键，该主键可以由一个getter函数自动访问，我们扩展了文本控件，如下所示


sap.ui.define(
['sap/m/Text']，
功能（文本）{
返回Text.extend（“namespace.controls.MergableText”{
元数据：{
特性：{
合并相关：{
键入：“字符串”，
默认值：“
}
}
},
渲染器：函数（oRm、oControl）{
sap.m.textrender.render（oRm，oControl）；//使用超级类渲染器例程
}
});
}
);迟回复，但希望仍然有用。基于此，我开发了自己的解决方案

好消息：无需扩展控件或对表进行分组，就可以实现所需的功能

添加sap.ui.core库：
向单元格中添加自定义数据，如下所示：
当您将column1和column2中的绑定组合为第2列中的自定义数据的值时，神奇的事情就发生了。这就阻止了整个列2变成一个单元格，从而得到了公共汽车和卡车之间所需的分隔符

最终解决方案：

<mvc:View
    controllerName="demo.FirstPage"
    xmlns="sap.m"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns:semantic="sap.f.semantic"
    xmlns:core="sap.ui.core">

    <Table
        id="table"
        mode="MultiSelect"
        width="auto"
        items="{
            path: '/'
        }"
        growing="true"
        growingScrollToLoad="true">

        <columns>
            <Column
                mergeDuplicates="true"
                mergeFunctionName="data#mergeKey">
                    <Text text="column1"/>
            </Column>
            <Column
                mergeDuplicates="true"
                mergeFunctionName="data#mergeKey">
                    <Text text="column2"/>
            </Column>
            <Column>
                <Text text="column3"/>
            </Column>
        </columns>

        <items>
            <ColumnListItem id="cli" type="Detail">
                <cells>
                    <Text text="{name}">
                            <customData>
                                <core:CustomData key="mergeKey" value="{name}" />
                            </customData>
                    </Text>                 
                    <Text text="{amount}">
                            <customData>
                                <core:CustomData key="mergeKey" value="{name}{amount}" />
                            </customData>
                    </Text>                 
                    <Text text="{currency}, {size}"/>                   
                </cells>
            </ColumnListItem>
        </items>
    </Table>
</mvc:View>



回复晚了，但希望仍然有用。基于此，我开发了自己的解决方案

好消息：无需扩展控件或对表进行分组，就可以实现所需的功能

添加sap.ui.core库：
向单元格中添加自定义数据，如下所示：
当您将column1和column2中的绑定组合为第2列中的自定义数据的值时，神奇的事情就发生了。这就阻止了整个列2变成一个单元格，从而得到了公共汽车和卡车之间所需的分隔符

最终解决方案：

<mvc:View
    controllerName="demo.FirstPage"
    xmlns="sap.m"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns:semantic="sap.f.semantic"
    xmlns:core="sap.ui.core">

    <Table
        id="table"
        mode="MultiSelect"
        width="auto"
        items="{
            path: '/'
        }"
        growing="true"
        growingScrollToLoad="true">

        <columns>
            <Column
                mergeDuplicates="true"
                mergeFunctionName="data#mergeKey">
                    <Text text="column1"/>
            </Column>
            <Column
                mergeDuplicates="true"
                mergeFunctionName="data#mergeKey">
                    <Text text="column2"/>
            </Column>
            <Column>
                <Text text="column3"/>
            </Column>
        </columns>

        <items>
            <ColumnListItem id="cli" type="Detail">
                <cells>
                    <Text text="{name}">
                            <customData>
                                <core:CustomData key="mergeKey" value="{name}" />
                            </customData>
                    </Text>                 
                    <Text text="{amount}">
                            <customData>
                                <core:CustomData key="mergeKey" value="{name}{amount}" />
                            </customData>
                    </Text>                 
                    <Text text="{currency}, {size}"/>                   
                </cells>
            </ColumnListItem>
        </items>
    </Table>
</mvc:View>



试过了，似乎不起作用。我希望第2列合并：尝试过，似乎不起作用。我希望第2列合并：仍然不工作，如果数据量相同，第2列的拆分器在“bus”和“truck”之间仍然丢失。@Tina，添加组：trueadded，仍然不工作。更新了演示。就像医生说的那样：@Tina哪个部分不工作了？很抱歉将
group:true
放错位置。我不确定我们的设计是否会接受这项工作。但似乎没有其他更好的解决办法。谢谢你的耐心。仍然不工作，如果数量数据相同，则第2列的拆分器在“总线”和“卡车”之间仍然丢失。@Tina，添加组：trueadded，仍然不工作。更新了演示。就像医生说的那样：@Tina哪个部分不工作了？很抱歉将
group:true
放错位置。我不确定我们的设计是否会接受这项工作。但似乎没有其他更好的解决办法。谢谢你的耐心。
mergeFunctionName="data#mergeKey"

<mvc:View
    controllerName="demo.FirstPage"
    xmlns="sap.m"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns:semantic="sap.f.semantic"
    xmlns:core="sap.ui.core">

    <Table
        id="table"
        mode="MultiSelect"
        width="auto"
        items="{
            path: '/'
        }"
        growing="true"
        growingScrollToLoad="true">

        <columns>
            <Column
                mergeDuplicates="true"
                mergeFunctionName="data#mergeKey">
                    <Text text="column1"/>
            </Column>
            <Column
                mergeDuplicates="true"
                mergeFunctionName="data#mergeKey">
                    <Text text="column2"/>
            </Column>
            <Column>
                <Text text="column3"/>
            </Column>
        </columns>

        <items>
            <ColumnListItem id="cli" type="Detail">
                <cells>
                    <Text text="{name}">
                            <customData>
                                <core:CustomData key="mergeKey" value="{name}" />
                            </customData>
                    </Text>                 
                    <Text text="{amount}">
                            <customData>
                                <core:CustomData key="mergeKey" value="{name}{amount}" />
                            </customData>
                    </Text>                 
                    <Text text="{currency}, {size}"/>                   
                </cells>
            </ColumnListItem>
        </items>
    </Table>
</mvc:View>