Checkbox 选择框
在一个集合内,用户可以通过复选框来选择一个或者多个选项。
复选框 用于打开或者关闭一个选项。
如果列表中有多个选择项,则可以使用复选框替代开关控件来节省空间。 如果您只需要一个选择项,请避免使用复选框,而改用开关控件。
简单复选框
自定义的复选框
以下是自定义此组件的一个示例。 您可以在重写文档页中了解有关此内容的更多信息。
什么时候使用
可访问性
(WAI-ARIA: https://www.w3.org/TR/wai-aria-practices/#checkbox)
- 所有表单控件都应该带有标签,而这包括了单选按钮,复选框和开关。 在大多数情况下,这是通过使用一个
<label>
元素(FormControlLabel)实现的。 - 如果无法使用标签,您则必须在输入组件中直接添加属性。 在这种情况下,您可以经由
inputProps
属性,来附着一些额外的属性(例如arial-label
,aria-labelledby
,title
)。
<Checkbox
value="checkedA"
inputProps={{ 'aria-label': 'Checkbox A' }}
/>