如何使用FlexBox在FlatButton中对齐材质图标？

Question

我正在尝试使用FlexBox在material-ui FlatButton中对齐Google素材图标。 我尝试了几种排列，但总是有相同的结果 - 图标位于按钮的最底部。我不确定这是否是一个特定于材料的问题。如何正确对齐？

  <FlatButton
    style = {buttonStyle}
    onClick = {
      onIncrementClick
    }
    icon={<i style= {{display:'flex', alignItems:'center', verticalAlign: 'center'}} className="material-icons">keyboard_arrow_up</i>}
    />

Answer 1

你有没有看过这里的文档 - http://www.material-ui.com/#/components/flat-button？

他们在左侧和右侧的平面按钮中有图标示例。以下是右侧图标的代码：

<FlatButton
  label="Label before"
  labelPosition="before"
  primary={true}
  style={styles.button}
  icon={<ActionAndroid />}
/>