我正在使用此卡组件,我想在其顶部构建。更具体地说,我想在线更改标题的背景颜色。我的方式看起来像这样:
<Card title='Produção e reembolso' style={{
ant-card-head: {
backgroundColor: '#232323'
}
}} >
<div> R$ {productionAmount} </div>
</Card>
这不起作用,因为React认为蚂蚁卡头是属性名称。有没有办法这样做,或者我必须使用/创建其他组件?
编辑
渲染的html看起来像
<div class="ant-card ant-card-bordered">
<div class="ant-card-head">
<h3 class="ant-card-head-title">Produção e reembolso</h3>
</div>
<div class="ant-card-body">
<div><!-- react-text: 150 --> R$ <!-- /react-text --></div>
</div>
</div>
如果要拥有一个具有样式的普通对象并从那里捡起东西,则必须单独声明内容并使用。
const AllStyles = {
"ant-card-head": {
backgroundColor: '#232323'
},
"another-thing": {
backgroundColor: '#ff00aa'
}
};
<Card title='Produção e reembolso' style={AllStyles["ant-card-head"]} >
<AnotherElem title='Produção e empréstimo' style={AllStyles["another-thing"]} >
如果您只想为此元素进行内联样式,则可以执行此操作
<Card title='Produção e reembolso' style={{
backgroundColor: '#232323'
}} >