InputLabel API
想要学习更多组件属性和 CSS API,可以查阅 React InputLabel 组件的 API 文档。
导入
import InputLabel from '@mui/material/InputLabel';
// 或
import { InputLabel } from '@mui/material';
组件名称
The nameMuiInputLabel
can be used when providing default props or style overrides in the theme.属性
FormLabel 组件的属性也是可用的。
名称 | 类型 | 默认值 | 描述 |
---|---|---|---|
children | node | The content of the component. | |
classes | object | Override or extend the styles applied to the component. See CSS API below for more details. | |
color | 'error' | 'info' | 'primary' | 'secondary' | 'success' | 'warning' | string | The color of the component. It supports both default and custom theme colors, which can be added as shown in the palette customization guide. | |
disableAnimation | bool | false | If true , the transition animation is disabled. |
disabled | bool | false | 如果被设置为 true ,那么该组件将会被禁用。 |
error | bool | false | If true , the label should be displayed in an error state. |
focused | bool | false | If true , the input of this label is focused. |
margin | 'dense' | If dense , will adjust vertical spacing. This is normally obtained via context from FormControl. | |
required | bool | false | if true , the label will indicate that the input is required. |
shrink | bool | false | If true , the label is shrunk. |
size | 'normal' | 'small' | 'normal' | |
sx | Array<func | object | bool> | func | object | The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details. | |
variant | 'filled' | 'outlined' | 'standard' | The variant to use. |
ref
则会被传递到根元素中。继承
While not explicitly documented above, the props of the FormLabel component are also available on InputLabel. You can take advantage of this to target nested components.CSS
规则名称 | 全局类名 | 描述 |
---|---|---|
root | .MuiInputLabel-root | Styles applied to the root element. |
focused | .Mui-focused | Pseudo-class applied to the root element if focused={true} . |
disabled | .Mui-disabled | Pseudo-class applied to the root element if disabled={true} . |
error | .Mui-error | Pseudo-class applied to the root element if error={true} . |
required | .Mui-required | Pseudo-class applied to the root element if required={true} . |
asterisk | .MuiInputLabel-asterisk | Pseudo-class applied to the asterisk element. |
formControl | .MuiInputLabel-formControl | Styles applied to the root element if the component is a descendant of FormControl . |
sizeSmall | .MuiInputLabel-sizeSmall | Styles applied to the root element if size="small" . |
shrink | .MuiInputLabel-shrink | Styles applied to the input element if shrink={true} . |
animated | .MuiInputLabel-animated | Styles applied to the input element unless disableAnimation={true} . |
filled | .MuiInputLabel-filled | Styles applied to the root element if variant="filled" . |
outlined | .MuiInputLabel-outlined | Styles applied to the root element if variant="outlined" . |
standard | .MuiInputLabel-standard | Styles applied to the root element if variant="standard" . |
您可以使用组件自定义选项对组件进行个性化:
- With a global class name.
- With a rule name as part of the component's
styleOverrides
property in a custom theme.