css - 如何让输入单选元素在 React [material-ui] 中水平对齐？

Question

单选组在 material-ui 中总是垂直列出的。有没有办法水平对齐它们？例如一条水平线上的所有单选按钮。

Answer 1

只需使用 row property :

<RadioGroup row><Radio /><Radio /></RadioGroup>

RadioGroup继承自 FormGroup因此 FormGroup 组件的属性也可用。

另一个带有标签的例子:

<RadioGroup aria-label="anonymous" name="anonymous" value={false} row>
  <FormControlLabel value="true" control={<Radio />} label="Yes" />
  <FormControlLabel value="false" control={<Radio />} label="No" />
</RadioGroup>