Question

使用openui5版本1.42.7，当鼠标悬停在TreeTable区域时，鼠标滚轮什么也不做，页面也不会滚动。

在之前的版本1.32.9中，此行为完美无缺。

这是我们页面的基本结构。

<Page id="page" navButtonPress="onNavBack" showNavButton="false" title="
    {i18n>pageTitle}" busy="{detailView>/busy}" enableScrolling="true"                  
    busyIndicatorDelay="{detailView>/delay}">
   <content>
     <Panel id ="panel" expandable="false" expanded="false" width="auto" visible="true"  
        class="sectionHeaderbackground">
        <IconTabBar id="iconTabBar" class="sapUiResponsiveContentPadding backgroundFormArea" 
         height="20px" visible="true" select="onSelectChanged"  headerMode="Inline"
         expandable="false">
           <items>
           <IconTabFiter>
              <l:Grid defaultSpan="L8 M8 S8">
                 <l:content>
                    <TreeTable id="TreeTableBasic" select="onSelectNodes" rows="{path:'/hierarchy',
                        parameters: {arrayNames:['children']}}" selectionMode="None"enableSelectAll="true"
                        selected="true" ariaLabelledBy="title" visibleRowCountMode="Fixed">
                         <t:toolbar>
            <Toolbar>
              <Title id="title" text="" />
              <ToolbarSpacer />
              <Button text="{i18n>collapseButton}" press="onCollapseAll" type="Emphasized"
                    icon="sap-icon://collapse" class="buttonColour"/>
              <Button text="{i18n>expandallButton}" press="onExpandAll" type="Emphasized"
                    icon="sap-icon://expand" class="buttonColour"/>
            </Toolbar>
             </t:toolbar>
             <t:columns>
            <t:Column width="13rem">
                <Label text="{i18n>locationTreeTable}" design="Bold"/>
                <t:template>
                   <HBox>
                    <CheckBox selected="{checkValue}" select="locationCheck"></CheckBox>
                    <core:Icon src="sap-icon://group" visible="{= !!${name}}"
                        class="paddingClass" />
                    <Link text="{name}" emphasized="{= !!${locationGroupGUID}}"></Link>
                  </HBox>
                   </t:template>
            </t:Column>
             </t:columns>
        </t:TreeTable>
        </l:content>
    </l:Grid>
    </IconTabFilter>
</items>
 </IconTabBar>
</Panel>
</content>
</Page>

为简洁起见，我删除了一些其他标记，但它们仅适用于没有滚动问题的页面中不相关的部分。

当我使用开发人员工具并从Html中删除highlighted div时，将鼠标悬停在TreeTable上时滚动工作

我对openUI5不太熟悉。事实上，这段代码是由顾问开发的。他们说这是一个框架问题，他们无能为力。

我怀疑这是一个需要在openui5 github存储库中报告的错误，但我想在提交错误之前检查这里，以防有一些明显错误的实现方式。

任何建议都将不胜感激。谢谢！

Answer 1

我能够通过重新定义css文件中的一些CSS类来找到解决方法。通过在sapUiTableCtrlScr类中添加属性pointer-events：none，我可以在表上滚动。

.sapUiTableTreeIcon {
    display: none;
    width: 25px;
    padding: 0;
    flex-shrink: 0;
    margin-right: 6px;
    pointer-events: auto;
}

值none将鼠标事件发送到具有此值的目标元素后面的元素。这样做可能是复选框和折叠和展开按钮不起作用所以我不得不在sapUiTableTreeIcon和sapMCb类中添加指针事件：auto。

.sapUiTableTreeIcon {
    display: none;
    width: 25px;
    padding: 0;
    flex-shrink: 0;
    margin-right: 6px;
    pointer-events: auto;
}

.sapMCb {
    box-sizing: border-box;
    height: 3rem;
    line-height: 3rem;
    vertical-align: top;
    text-align: left;
    padding: 0 0 0 3rem;
    pointer-events: auto;
}

将鼠标悬停在TreeTable上不会滚动页面

1 个答案: