javascript - 修改或覆盖material-ui按钮css

Question

我有一个 Material UI RaisingButton，我想更改背景颜色。

我有这个:

const style = {
 backgroundColor: 'green'
};

export default class CreateLinksave extends React.Component {

 <RaisedButton
   label="Continue"
   style={style}/>

}

但是当我刷新页面时，material-ui 样式仍然存在，那么如何覆盖该样式呢？

第二个问题是，如何避免进行内联样式？我正在考虑创建一个包含组件所需样式的常量的 js 文件，导入它并以这种方式访问​​我的样式，这是一个好方法吗？

我是 React 新手，所以一些帮助会很好......

问候。

Answer 1

您可以通过传入属性来覆盖样式。请参阅docs支持哪些属性。

只要规则简单，使用您的样式创建一个 JS 文件(或多个文件)听起来是个好主意。如果您发现自己合并和覆盖样式，那么将样式保留在组件文件中会更容易。

你最终会得到类似的结果

import {green} from './my-style/colors';
...
<RaisedButton label="change min" backgroundColor={green} />