如何在明暗模式下更改React中的图标颜色

Question

const mystyle = {
height: "30px",
marginTop: "10px",
};
const mycolor = {
color: "green"
}

<InfoBox
size="150"
Number="My Number 1"
Name="Update Now"
icon={<FontAwesomeIcon icon={faComment} style={{...mystyle, ...mycolor}}/>}
classes="icon-primary"
/>

Answer 1

如何跟踪模式更改？如果这是一个变量或状态变量，那么您可以简单地在样式对象中添加一个三元运算符。根据模式的不同，您可以使用三元运算符来使用您的样式。

例如：

<h2
style={
count > 0
? {backgroundColor: 'lime', color: 'white'}
: {backgroundColor: 'salmon', color: 'powderblue'}
}
>
Count: {count}
</h2>

或者，点击此链接：React Js Es 6 风格上的三元运算符