ios 上未显示 ionic 3 验证边框

Question

我正在使用 ionic3 创建一个带有表单验证的登录页面。当我运行 android 和浏览器平台的应用程序时，验证显示为红色底部边框。但对于 ios 平台，底部不显示红色边框。我缺少什么？

参考屏幕截图

Answer 1

在搜索 github 项目中报告的问题后，我得到了答案，在此发布以帮助其他人。

参考Link Enable text input highlighting for ios

By-default input highlighting for ios platform is set to false. All we need to do is, set it to true (enable it) inside a theme\variables.scss as follows

$text-input-ios-show-focus-highlight: true;

Answer 2

如果输入无效未被触及可以添加css类:

ion-item.ng-invalid.ng-touched{
       border-bottom: 1px solid map-get($colors, danger) !important;
   }

Answer 3

好吧，以下对我有用iOS：

//-- Validation failed
ion-item.ion-invalid.ion-dirty{
       border-bottom: 2px solid var(--ion-color-danger) !important;
}

//-- Validation passed
ion-item.ion-valid.ion-dirty{
    border-bottom: 2px solid var(--ion-color-success) !important;
}

ios 上未显示 ionic 3 验证边框

ionic 3 validation border not showing on ios

ionic-framework

ionic2

ionic3