离子刷新器颜色图标不会改变 ionic 5 (stencil)

问题描述

如何自定义 ionic 5 中 ionic refresher spinner 图标的样式? 我正在开发具有 lightmode 和 darkmode 的应用程序。在 lightmode 中,微调器在白色背景上以深灰色显示。到现在为止还挺好。但是如果我切换到暗模式,它会显示为白底白字。我试图改变颜色 f.e.与

<ion-refresher slot="fixed">
      <ion-refresher-content color="primary" refreshing-spinner="crescent">
</ion-refresher-content>

或 SCSS

    ion-refresher {
  ion-refresher-content {
      --color: red;
    }
  }

    ion-refresher {
  ion-refresher-content {
      color: red;
    }
  }

并将变量设置为

$refresher-icon-color: red;

我真的很感激一些帮助。 谢谢!

解决方法

你需要一些 CSS 来完成这项工作。我在下面添加了一个 CSS 代码,您可以将其添加到 global.css 文件中,并且您可以从 ion-refresher-content color="primary"

中删除颜色选项
//add this css code in your global.scss file which in your src folder
ion-refresher.refresher-native ion-spinner{
    color: red!important;      
}