1

我正在使用 material-ui 并尝试RaisedButton使用其名为的道具之一来设置背景颜色的样式backgroundColor：

import React, {Component} from 'react';
import RaisedButton from 'material-ui/lib/raised-button';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import s from './Home.scss';

class Home extends Component {
    render() {
        return (
            <div>
                <h1 className={s.h1}>Pomodoro Tech</h1>
                <div className={s.imgContain}>
                    <img src={require('./pom.png')} width="100%" height="100%"/>
                </div>
                <div>
                    <RaisedButton
                        label="Login"
                        secondary={true}
                        backgroundColor="#77CA2D"
                    />
                    <RaisedButton
                        backgroundColor="#77CA2D"
                        label="About"
                    />
                </div>
            </div>
        );
    }
}

export default withStyles(Home, s);

但是该属性永远不会产生任何差异。

我使用的material-ui的版本是0.15.0-alpha.1，根据npm list --depth=0命令的结果。

在我问这个问题之前，我已经做了一些搜索，但无法弄清楚问题是什么。

4

2 回答 2

0

确保你不包括primary={true}; 否则它会忽略你的backgroundColor。见下面我的：

<RaisedButton
  label={stepIndex === 2 ? 'Finish' : 'Next'}
  disableTouchRipple={true}
  disableFocusRipple={true}
  onClick={this.handleNext}
  backgroundColor={teal400}
/>
于 2017-12-08T22:15:55.210 回答
0

它对我有用，一直在使用 material-ui v0.14.4，可能是它一直在闯入0.15.0-alpha.1

请将工作示例粘贴到 JSBin 或其他地方以进一步调试它。

于 2016-04-09T07:14:20.057 回答