更改语义 ui 反应输入中日历图标的颜色

Question

我正在使用语义 UI React 来输入日期。我需要更改输入的日历图标颜色。是否可以 ？ 这是我的代码

<Input
  id="fromDate"
  name="fromDate"
  type="date"
  value={state.fromDate}
  onChange={onHandleChange}
  placeholder="Date"
  className="custom-date-input"
 />

Answer 1

我不确定是否有更好的方法来处理其他特定颜色，但您可以对其使用滤镜。你只需要用 CSS 选择它

.custom-date-input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(); }

就像这样。 另外，这里是我实现它的codesandbox的link，我尝试使用过滤器获取占位符中的颜色。那么就来看看吧，希望对你有帮助。