Question

我正在学习Material UI，我正在尝试显示带有标签的复选框。按照在线docs中的示例，我正在渲染一个复选框，但没有标签。我做错了什么？

 return (
        <div className="entryForm" >
            <div style={{width:'100%'}}>
                <h3 style={ {display:'inline-block' } }>
                    User Details
                </h3>
                <span style={{float:'right'}}>
                    <Checkbox
                        label="Active"
                        labelPosition="left"
                    />
                </span>
            </div>...

Answer 1

我认为这取决于您使用的MUI版本。如果您使用的是1.0版及更高版本，则应使用FormControlLabel：

import {FormControlLabel} from 'material-ui/Form';

<FormControlLabel
control={
    <Checkbox
        name="SomeName"
        value="SomeValue"
    />
}
label="MyLabel"/>

文档中的更多内容： https://material-ui-next.com/demos/selection-controls/

Answer 2

FormControlLabel 将是要走的路，这是更新后的导入 v4.11.1 的样子

import { FormControlLabel } from '@material-ui/core';

<FormControlLabel
control={
    <Checkbox
        name="SomeName"
        value="SomeValue"
    />
}
label="MyLabel"/>

材料用户界面 - 复选框标签丢失

2 个答案: