无法使用 LESS (ant.design) 更改主按钮颜色

Question

我已经使用 ant design 来获得主按钮样式但是尝试用 LESS 更改它的背景颜色但由于某种原因没有任何效果，有人可能遇到同样的问题或知道解决方案，我知道我可以做通过执行 style={{background-color}} 很简单，但是我不想在应该使用 LESS 时编写额外的代码。我正在为所有 tekst 设置原色，效果很好

@btn-primary-bg: #1B2F55;

  <Button type='primary' onClick={this.handleSubmitEmail}>{submit}</Button>

antd.customize.less

enter image description here

Answer 1

您必须访问 antd 的按钮 class 才能更改样式。

为您的按钮组件添加一个新的 class 名称。

 <Button type='primary' classname={'my-button'} onClick={this.handleSubmitEmail}>{submit}</Button>

然后，在 LESS 文件中，执行此操作，

.ant-btn.my-button{
  background-color: 'red'
}

Answer 2

我发现了问题，项目是从另一个项目中获取的，app.css 有带有颜色设置的 ant primary，因此我发现并了解了优先级

Answer 3

你可以使用<Button htmlType="button" type="primary" id="turf-button" disabled={bnstate} shape="round" size="small" onClick={onconnect}>
然后

#turf-button {
  background-color: lime;
}

无法使用 LESS (ant.design) 更改主按钮颜色

Cannot change primary button color with LESS (ant.design)

css

less

reactjs