javascript - 在 React 中使用带有 props 的 react-css-modules/css-modules

Question

我有一个名为 ColorInput 的可重用组件。

但是，每个输入都有不同的文本颜色。因此，我为每个输入设置了不同的类。例如，红色输入、绿色输入、蓝色输入。

SCSS

.input-red{
  composes: input;
  composes: theme-red from "./_theme-colors.scss";
}

颜色输入组件

class ColorInput extends React.Component{
  render(){
    return( 
      <input styleName={this.props.styleName} />
  )
}

}

StyleName 没有输出到正确的类。

<ColorInput styleName ='input-red'>
<ColorInput styleName ='input-green'>
<ColorInput styleName ='input-blue'>

我知道这可能是一个报告的问题，但是，我不确定我是否有同样的问题。

更新：我计划尽快包含一个现场演示。