如何移除SAPUI5输入框的聚焦虚线边框并禁用点击聚焦效果

针对sap.m.Input控件自动聚焦/点击聚焦时显示虚线边框的需求，可通过以下两种方案实现：

方案1：仅移除聚焦虚线边框（保留输入及聚焦功能） #

该虚线是SAPUI5框架自带的默认聚焦样式，通过自定义CSS覆盖默认样式即可：

/* 全局适配所有sap.m.Input控件 */
.sapMInputBaseContentWrapper:focus::after,
.sapMInputBaseContentWrapperFocus::after {
    outline: none !important;
}
/* 仅适配指定输入框：给目标Input控件添加customClass="noFocusBorder"即可 */
.noFocusBorder .sapMInputBaseContentWrapper:focus::after,
.noFocusBorder .sapMInputBaseContentWrapperFocus::after {
    outline: none !important;
}

样式添加方式：

• 将CSS代码写入项目自定义样式文件，在manifest.json的resources配置中引入
• 或直接内嵌到视图文件的<style>标签中

如果需要取消页面加载完成后输入框自动聚焦的特性，直接给Input控件添加属性focusOnRendering="false"即可。

方案2：禁用点击输入框的聚焦功能 #

如果不需要输入框响应聚焦交互，可通过以下两种方式实现：

方式A：设置为只读状态（可复制内容，不可编辑） #

<Input editable="false" />

方式B：完全阻止聚焦事件（即使点击也不会触发聚焦效果） #

1. 给Input控件绑定focusin事件回调

<Input focusin=".preventInputFocus" />

2. 在控制器中添加回调逻辑

preventInputFocus: function(oEvent) {
    oEvent.preventDefault();
    oEvent.getSource().blur();
}

内容的提问来源于stack exchange，提问作者Teza Kosanam