无法自定义默认搜索组件的颜色

Question

我有一个 Ionic 3 应用程序，我在其中有一个搜索字段。我正在尝试使用深色背景和白色文本为其着色。

我有以下代码，在背景上运行良好，但默认图标和占位符文本没有变白：

  .searchbar {
    background-color:#2f303e; 
    color:#fff;
      .searchbar-input {
        background-color:#2f303e; 
        color:#fff;
      }
  }

这是组件：

  <ion-searchbar (ionInput)="getItems($event)"></ion-searchbar>

我错过了什么？

Answer 1

查看文档： https://ionicframework.com/docs/api/components/searchbar/Searchbar/ 在 Sass 变量部分你有 $searchbar-ios-input-search-icon-color 和更多你需要在 theme/variables.scss 中声明的变量只需添加它们即可。

编码愉快..:)

Answer 2

使用的默认搜索图标是 svg（用作背景图像）。使用 color: #fff;

无法更改其颜色

改为使用 sass 可用于 图标颜色的变量:

ios: $searchbar-ios-input-search-icon-svg

android: $searchbar-md-input-search-icon-color

对于占位符颜色:

ios: $searchbar-md-input-placeholder-color

android: $searchbar-ios-input-placeholder-color

无法自定义默认搜索组件的颜色

Can't customize color of default search component

sass

ionic3

scss-mixins