樣式不適用於MaterialUI React中的SVGIcon

Question

我有一種適用於ActionSearch圖標的樣式，但不幸的是它沒有通過。

不知道我可以為這個問題寫更多的東西，我認為這很簡單，但是盡管Paper獲得樣式，但圖標組件卻沒有。

知道為什么會這樣嗎？

import React from 'react';
import Paper from 'material-ui/Paper';
import TextField from 'material-ui/TextField';
import IconButton from 'material-ui/IconButton';
import ActionSearch from 'material-ui/svg-icons/action/search';

const stylePaper = {
  width: 400,
  margin: '40px auto',
  paddingBottom: 10,
  textAlign: 'center',
  display: 'inline-block'
};

const styleIcon = {
  position: 'absolute',
  top: 20
};

export default class Home extends React.Component {
  constructor(props) {
    super(props);
    this.state = {value: ''};

    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  handleChange(event) {
    this.setState({value: event.target.value});
  }

  handleSubmit(event) {
    alert('A name was submitted: ' + this.state.value);
    event.preventDefault();
  }

  render() {
    return (
      <form onSubmit={this.handleSubmit}>
        <Paper zDepth={2} style={stylePaper} >
          <TextField
            hintText="Type in brand, position or industry"
          />
          <IconButton>
            <ActionSearch style={styleIcon} />
          </IconButton>
        </Paper>
      </form>
    );
  }
}

這是檢查員圖像

Answer 1

因為svg圖標已作為組件包裝在此庫中（material-ui react），所以我認為您不能直接應用樣式對象。 從官方文檔來看，我認為您可能需要為組件中的屬性“ iconStyle”傳遞樣式對象，請在此處查看http://www.material-ui.com/#/components/icon-button 。