sap.ui.table.Table 和 sap.ui.table.TreeTable 不显示最后一行数据

sap.ui.table.Table and sap.ui.table.TreeTable do not display the last data row

SAPUI5 版本 1.44.6 上出现以下错误。当我们将 sap.ui.table.Tablesap.ui.table.TreeTablevisibleRowCountMode="Auto" 一起使用时,在较低分辨率下向下滚动时不会显示最后一行数据。这些表格在 1920x1080 等较高分辨率下完美运行,但如果我将屏幕分辨率更改为 1366x768,例如,我无法向下滚动到最后一个数据行,但只能滚动到最后一个数据行。只有当我点击倒数第二行并按时,它才会显示最后一行数据。

我已经为此寻找解决方案,但没有找到任何解决方案!你们知道如何解决或避免这个问题吗?考虑到它们的显示区域,我需要这些表可以自动调整。提前致谢!

我们项目中的一个小视图示例(对不起,我无法重现可测试的版本):

<Dialog id="AllocationDayDialog"
  xmlns="sap.m"
  xmlns:l="sap.ui.layout"
  xmlns:f="sap.ui.layout.form"
  xmlns:t="sap.ui.table"
  xmlns:core="sap.ui.core"
  title="{i18n>Allocations}"
>
  <IconTabBar expandable="false" stretchContentHeight="true">
    <items>
      <IconTabFilter text="{i18n>Person}">
        <Panel height="100%">
          <t:TreeTable id="personTreeTableId"
            selectionMode="None"
            selectionBehavior="Row"
            enableColumnReordering="false"
            expandFirstLevel="false"
            collapseRecursive="false"
            enableSelectAll="true"
            visibleRowCountMode="Auto"
            rows="{
              path: 'PersonNodesModel>/results',
              parameters: {
                arrayNames: [ 'children' ]
              }
            }"
          >
            <t:columns>
              <t:Column width="30%">
                <Label text="{i18n>Maintainer} - {i18n>Order}/{i18n>Description}" />
                <t:template>
                  <Text text="{PersonNodesModel>Maintainer}{PersonNodesModel>Order} {PersonNodesModel>OrderDescription}" />
                </t:template>
              </t:Column>
              <t:Column width="10%">
                <Label text="{i18n>WorkCenter}" />
                <t:template>
                  <Text text="{PersonNodesModel>WorkCenter}" />
                </t:template>
              </t:Column>
            </t:columns>
          </t:TreeTable>
        </Panel>
      </IconTabFilter>
    </items>
  </IconTabBar>
  <buttons>
    <Button id="closeButton" text="{i18n>Close}" press=".onClose"/>
  </buttons>
</Dialog>

我已经设法找到解决此问题的方法。看起来这个问题与 table 本身无关,而是与其滚动条有关。因此,每当用户执行加载 table 行(例如 expanding/collapsing )的操作时,我都会更改第一列的宽度以触发刷新滚动条可滚动区域的事件。我试图找到一种更好的方法来刷新滚动条而不必更改 table 本身,但找不到更好的方法。

代码示例 1:将事件附加到调用列调整大小函数的 table。

<t:TreeTable id="workCenterTreeTableId" selectionMode="None" enableColumnReordering="false" expandFirstLevel="false" collapseRecursive="false" enableSelectAll="true" rows="{path : 'WorkCenterNodesModel>/results', parameters : { arrayNames:['children'] }}" visibleRowCountMode="Auto" toggleOpenState="onToggleOpenState">

代码示例 2:列调整大小函数。

onToggleOpenState() {
    this._fixTableScrollbarPosition();
}

_fixTableScrollbarPosition() {
        let treeTable = this.getFragmentById("personTreeTableId");
        if (treeTable) {
            if (treeTable.getColumns()[0].getWidth() === "30%") {
                treeTable.getColumns()[0].setWidth("29%");
            } else {
                treeTable.getColumns()[0].setWidth("30%");
            }
        }
        treeTable = this.getFragmentById("workCenterTreeTableId");
        if (treeTable) {
            if (treeTable.getColumns()[0].getWidth() === "30%") {
                treeTable.getColumns()[0].setWidth("29%");
            } else {
                treeTable.getColumns()[0].setWidth("30%");
            }
        }
    }