使用卡片/卡片标题时 <div> 标签上的未知道具`iconStyle`

Question

无法设置可展开图标按钮的样式
0.18.1版

这是我的代码

class TaskCard  extends React.Component {
  constructor(props){
    super(props);
 }
  render(){
  const {data}=this.props;
  return (
  <Card >
    <CardHeader
      title={this.props.title}
      subtitle= {data.FixDetails}
      actAsExpander={true}
      showExpandableButton={true}
      avatar={
              <div style={{display:'inline'}}>
              <FontIcon className="material-icons" style={{marginRight:'15px'}} >play_arrow</FontIcon>
              <FontIcon className="material-icons" color={getSevrityColor(data.Sevirity)} >error</FontIcon>
              </div>
              }
      style={{display:'inline-block',width:'80%'}}
      iconStyle={{margin:'0px'}}
    />
    <CardActions style={{display:'inline-block'}}>`
//buttons
    </CardActions>
    <CardText expandable={true} >
      {data.FixDetails}
    </CardText>
  </Card>
  )
}`
};

我通过地图渲染 data.Tasks.map((x,i) => <TaskCard key={i} data={x} Tags={x.Tags} title={x.Tags.origin} subtitle={x.Type}/>)

我得到的错误是。我必须在头像中添加箭头，因为我无法根据需要将 IconButton 放在左侧。

Warning: Unknown prop iconStyle on <div> tag. Remove this prop from the element. For details, 
    in div (created by CardHeader)
    in CardHeader (created by TaskCard)
    in div (created by Card)
    in div (created by Paper)
    in Paper (created by Card)
    in Card (created by TaskCard)
    in TaskCard (created by tasks)
    in div (created by List)
    in List (created by tasks)
    in div (created by tasks)
    in div (created by tasks)
    in div (created by tasks)
    in tasks (created by Unknown)
    in div (created by Page)
    in TweenOne (created by QueueAnim)
    in div (created by QueueAnim)
    in QueueAnim (created by Page)
    in div (created by Page)
    in Page (created by Connect(Page))
    in Connect(Page) (created by DimensionsHOC)
    in div (created by DimensionsHOC)
    in DimensionsHOC (created by Unknown)
    in div (created by MainAppLoggedIn)
    in div (created by MainAppLoggedIn)
    in div (created by MainAppLoggedIn)
    in section (created by MainAppLoggedIn)
    in div (created by MainAppLoggedIn)
    in MainAppLoggedIn (created by DimensionsHOC)
    in div (created by DimensionsHOC)
    in DimensionsHOC (created by BaseDashboard)
    in BaseDashboard (created by Connect(BaseDashboard))
    in Connect(BaseDashboard) (created by Unknown)
    in div (created by App)
    in div (created by App)
    in MuiThemeProvider (created by App)
    in App (created by Connect(App))
    in Connect(App) (created by Unknown)
    in Unknown (created by Unknown)
    in Unknown
    in Provider

这一切的主要目的是让可展开的 IconButton 出现在左侧而不是右侧。

Answer 1

您可能正在使用该库的旧版本，其中 iconStyle 尚未实现。您可以忽略此警告（顺便说一下，这不是您提到的错误）或只是升级到当前版本。

Property reference for your estimated material-ui version (0.18.1)

关于头像图标位置： CardHeader中有一个头像定位方案，在title\subtitle块之前（即左侧）有图像，所以你需要覆盖它。 看我做的this example，根据你的代码sn-p。