Space 添加到 sap.m.ObjectHeader 中时,键在输入控件中不起作用
Space key not working in input control when added inside sap.m.ObjectHeader
我在键盘上的 space 键(Space 栏)有问题,当我尝试在 Fiori 应用程序的 FeedInput
中键入文本时,它不起作用。如果我按 Shift + Space,可以添加空 space。此组合适用于 PC,但不适用于移动设备。
我知道问题的发生是因为我将 FeedInput
嵌入到 <headerContainer>
或其他一些 UI 元素中。它实际上不仅与 FeedInput
相关,而且与 Input
、SmartField
in SmartTable
等相关
我可以看到 SAP 为 class sap.m.HeaderContainer
提供了以下信息:
The container that provides a horizontal layout. It provides a horizontal scrolling on the mobile devices. On the desktop, it provides scroll left and scroll right buttons. This control supports keyboard navigation. You can use ← and → to navigate through the inner content. The Home key puts focus on the first control and the End key puts focus on the last control. Use Enter or Space key to choose the control. (source)
我发现,如果我在浏览器调试器中删除 KEYPRESS body#content.sapUiBody
的事件侦听器,space 栏会开始在所有类型的文本字段中正常工作。
<ObjectHeader id="ohDetails"
numberState="Success"
responsive="true"
>
<headerContainer>
<IconTabBar id="itb1"
select=".onIconTabBarSelect"
expandable="false"
>
<items>
<!-- ... -->
<IconTabFilter id="iftLog"
key="logKey"
icon="sap-icon://notes"
>
<VBox alignContent="End">
<FeedInput id="fiComment"
class="sapUiSmallMarginTopBottom"
post=".onSubmitComment"
icon="sap-icon://comment"
placeholder="{i18n>plhFeedInput}"
/>
<!-- ... -->
</VBox>
</IconTabFilter>
</items>
</IconTabBar>
</headerContainer>
</ObjectHeader>
把<IconTabBar>
作为<ObjectHeader>
的头容器没有错。事实上,<headerContainer>
聚合等待 <IconTabBar>
作为实现 "sap.m.ObjectHeaderContainer"
.
的控件之一
之所以不起作用是因为commit:d05437d
while trying to prevent scrolling when the space bar was pressed. With commit:38f5481
引入了回归,现在已经全部修复了。
- Preventing all pressing of SPACE when inside
ObjectHeader
caused that, in case there is Input
field inside HeaderContainer
, the user couldn't enter space in it.
- On the other hand, SPACE is still prevented on all interactive elements of the
ObjectHeader
.
演示:https://jsbin.com/takequm/edit?js,output
更新: 该修复程序现在与 1.67+ 一起分发。例如,将 UI5 资源 bootstrap 更新为 src="https://ui5.sap.com/1.70.0/resources/sap-ui-core.js"
后,我们可以看到空格键再次起作用。
我在键盘上的 space 键(Space 栏)有问题,当我尝试在 Fiori 应用程序的 FeedInput
中键入文本时,它不起作用。如果我按 Shift + Space,可以添加空 space。此组合适用于 PC,但不适用于移动设备。
我知道问题的发生是因为我将 FeedInput
嵌入到 <headerContainer>
或其他一些 UI 元素中。它实际上不仅与 FeedInput
相关,而且与 Input
、SmartField
in SmartTable
等相关
我可以看到 SAP 为 class sap.m.HeaderContainer
提供了以下信息:
The container that provides a horizontal layout. It provides a horizontal scrolling on the mobile devices. On the desktop, it provides scroll left and scroll right buttons. This control supports keyboard navigation. You can use ← and → to navigate through the inner content. The Home key puts focus on the first control and the End key puts focus on the last control. Use Enter or Space key to choose the control. (source)
我发现,如果我在浏览器调试器中删除 KEYPRESS body#content.sapUiBody
的事件侦听器,space 栏会开始在所有类型的文本字段中正常工作。
<ObjectHeader id="ohDetails"
numberState="Success"
responsive="true"
>
<headerContainer>
<IconTabBar id="itb1"
select=".onIconTabBarSelect"
expandable="false"
>
<items>
<!-- ... -->
<IconTabFilter id="iftLog"
key="logKey"
icon="sap-icon://notes"
>
<VBox alignContent="End">
<FeedInput id="fiComment"
class="sapUiSmallMarginTopBottom"
post=".onSubmitComment"
icon="sap-icon://comment"
placeholder="{i18n>plhFeedInput}"
/>
<!-- ... -->
</VBox>
</IconTabFilter>
</items>
</IconTabBar>
</headerContainer>
</ObjectHeader>
把<IconTabBar>
作为<ObjectHeader>
的头容器没有错。事实上,<headerContainer>
聚合等待 <IconTabBar>
作为实现 "sap.m.ObjectHeaderContainer"
.
之所以不起作用是因为commit:d05437d
while trying to prevent scrolling when the space bar was pressed. With commit:38f5481
引入了回归,现在已经全部修复了。
- Preventing all pressing of SPACE when inside
ObjectHeader
caused that, in case there isInput
field insideHeaderContainer
, the user couldn't enter space in it.- On the other hand, SPACE is still prevented on all interactive elements of the
ObjectHeader
.
演示:https://jsbin.com/takequm/edit?js,output
更新: 该修复程序现在与 1.67+ 一起分发。例如,将 UI5 资源 bootstrap 更新为 src="https://ui5.sap.com/1.70.0/resources/sap-ui-core.js"
后,我们可以看到空格键再次起作用。