删除焦点上的输入高亮边框

Question

我正在尝试从输入中删除突出显示

html的：

<ion-item>
  <ion-input value="" type="text" placeholder="Add a comment..."></ion-input>
  <button ion-button clear item-right (click)="send()">POST</button>
</ion-item>

我还在.scss中添加了这个：

$text-input-md-show-success-highlight:  false;
$text-input-md-show-error-highlight:  false;

但是，除非我删除ion-item但我无法对齐按钮POST

，否则它不会生效

<ion-input value="" type="text" placeholder="Add a comment..."></ion-input>
  <button ion-button clear item-right (click)="send()">POST</button>

Answer 1

好吧，我发现的唯一解决方案......但这不是最好的解决方法

lapply

Answer 2

SCSS变量为$text-input-md-show-focus-highlight。

尝试：

$text-input-md-show-focus-highlight: false;

文档link

Answer 3

可行的问题是你定义了你的scss（并且你可以在当前的@component styleUrls中定义它吗？）。如果您使用angular-cli define

生成项目

$text-input-md-show-success-highlight:  false;
$text-input-md-show-error-highlight:  false;

主目录中的style.scss中的

和everythig应该可以正常工作

Answer 4

如果你检查一下，你就会知道影响它的css是：

.item-input.input-has-focus::after{
  border-bottom-color: #387ef5;
}

所以试试，

.item-input.input-has-focus::after{
  border-bottom: 0;
}

它应该有用。

注意：将它放在正确的css类层次结构中。