LoadingButton API
导入
import LoadingButton from '@mui/lab/LoadingButton';
// 或
import { LoadingButton } from '@mui/lab';组件名称
在主题中，名称“MuiLoadingButton”可用于提供默认属性（props），或者样式覆盖属性
Button 组件的属性也是可用的。
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| 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. | |
| disabled | bool | false | 如果被设置为 true，那么该组件将会被禁用。 |
| loading | bool | false | If true, the loading indicator is shown. |
| loadingIndicator | node | <CircularProgress color="inherit" size={16} /> | Element placed before the children if the button is in loading state. The node should contain an element with role="progressbar" with an accessible name. By default we render a CircularProgress that is labelled by the button itself. |
| loadingPosition | 'start' | 'end' | 'center' | 'center' | The loading indicator can be positioned on the start, end, or the center of the button. |
| 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 | 'contained' | 'outlined' | 'text' | string | 'text' | The variant to use. |
ref 则会被传递到根元素中。继承
尽管上文没有明文记录， Button 组件 的属性(props) 在组件LoadingButton上同样是可用的。 你可以利用这一点来 指向嵌套组件CSS
| 规则名称 | 全局类名 | 描述 |
|---|---|---|
| root | .MuiLoadingButton-root | Styles applied to the root element. |
| text | .MuiLoadingButton-text | Styles applied to the root element if variant="text". |
| textInherit | .MuiLoadingButton-textInherit | Styles applied to the root element if variant="text" and color="inherit". |
| textPrimary | .MuiLoadingButton-textPrimary | Styles applied to the root element if variant="text" and color="primary". |
| textSecondary | .MuiLoadingButton-textSecondary | Styles applied to the root element if variant="text" and color="secondary". |
| textSuccess | .MuiLoadingButton-textSuccess | Styles applied to the root element if variant="text" and color="success". |
| textError | .MuiLoadingButton-textError | Styles applied to the root element if variant="text" and color="error". |
| textInfo | .MuiLoadingButton-textInfo | Styles applied to the root element if variant="text" and color="info". |
| textWarning | .MuiLoadingButton-textWarning | Styles applied to the root element if variant="text" and color="warning". |
| outlined | .MuiLoadingButton-outlined | Styles applied to the root element if variant="outlined". |
| outlinedInherit | .MuiLoadingButton-outlinedInherit | Styles applied to the root element if variant="outlined" and color="inherit". |
| outlinedPrimary | .MuiLoadingButton-outlinedPrimary | Styles applied to the root element if variant="outlined" and color="primary". |
| outlinedSecondary | .MuiLoadingButton-outlinedSecondary | Styles applied to the root element if variant="outlined" and color="secondary". |
| outlinedSuccess | .MuiLoadingButton-outlinedSuccess | Styles applied to the root element if variant="outlined" and color="success". |
| outlinedError | .MuiLoadingButton-outlinedError | Styles applied to the root element if variant="outlined" and color="error". |
| outlinedInfo | .MuiLoadingButton-outlinedInfo | Styles applied to the root element if variant="outlined" and color="info". |
| outlinedWarning | .MuiLoadingButton-outlinedWarning | Styles applied to the root element if variant="outlined" and color="warning". |
| contained | .MuiLoadingButton-contained | Styles applied to the root element if variant="contained". |
| containedInherit | .MuiLoadingButton-containedInherit | Styles applied to the root element if variant="contained" and color="inherit". |
| containedPrimary | .MuiLoadingButton-containedPrimary | Styles applied to the root element if variant="contained" and color="primary". |
| containedSecondary | .MuiLoadingButton-containedSecondary | Styles applied to the root element if variant="contained" and color="secondary". |
| containedSuccess | .MuiLoadingButton-containedSuccess | Styles applied to the root element if variant="contained" and color="success". |
| containedInfo | .MuiLoadingButton-containedInfo | Styles applied to the root element if variant="contained" and color="info". |
| containedError | .MuiLoadingButton-containedError | Styles applied to the root element if variant="contained" and color="error". |
| containedWarning | .MuiLoadingButton-containedWarning | Styles applied to the root element if variant="contained" and color="warning". |
| disableElevation | .MuiLoadingButton-disableElevation | Styles applied to the root element if disableElevation={true}. |
| focusVisible | .Mui-focusVisible | Pseudo-class applied to the ButtonBase root element if the button is keyboard focused. |
| disabled | .Mui-disabled | Pseudo-class applied to the root element if disabled={true}. |
| colorInherit | .MuiLoadingButton-colorInherit | Styles applied to the root element if color="inherit". |
| textSizeSmall | .MuiLoadingButton-textSizeSmall | Styles applied to the root element if size="small" and variant="text". |
| textSizeMedium | .MuiLoadingButton-textSizeMedium | Styles applied to the root element if size="medium" and variant="text". |
| textSizeLarge | .MuiLoadingButton-textSizeLarge | Styles applied to the root element if size="large" and variant="text". |
| outlinedSizeSmall | .MuiLoadingButton-outlinedSizeSmall | Styles applied to the root element if size="small" and variant="outlined". |
| outlinedSizeMedium | .MuiLoadingButton-outlinedSizeMedium | Styles applied to the root element if size="medium" and variant="outlined". |
| outlinedSizeLarge | .MuiLoadingButton-outlinedSizeLarge | Styles applied to the root element if size="large" and variant="outlined". |
| containedSizeSmall | .MuiLoadingButton-containedSizeSmall | Styles applied to the root element if size="small" and variant="contained". |
| containedSizeMedium | .MuiLoadingButton-containedSizeMedium | Styles applied to the root element if size="small" and variant="contained". |
| containedSizeLarge | .MuiLoadingButton-containedSizeLarge | Styles applied to the root element if size="large" and variant="contained". |
| sizeSmall | .MuiLoadingButton-sizeSmall | Styles applied to the root element if size="small". |
| sizeMedium | .MuiLoadingButton-sizeMedium | Styles applied to the root element if size="medium". |
| sizeLarge | .MuiLoadingButton-sizeLarge | Styles applied to the root element if size="large". |
| fullWidth | .MuiLoadingButton-fullWidth | Styles applied to the root element if fullWidth={true}. |
| startIcon | .MuiLoadingButton-startIcon | Styles applied to the startIcon element if supplied. |
| endIcon | .MuiLoadingButton-endIcon | Styles applied to the endIcon element if supplied. |
| iconSizeSmall | .MuiLoadingButton-iconSizeSmall | Styles applied to the icon element if supplied and size="small". |
| iconSizeMedium | .MuiLoadingButton-iconSizeMedium | Styles applied to the icon element if supplied and size="medium". |
| iconSizeLarge | .MuiLoadingButton-iconSizeLarge | Styles applied to the icon element if supplied and size="large". |
| loading | .MuiLoadingButton-loading | Styles applied to the root element if loading={true}. |
| loadingIndicator | .MuiLoadingButton-loadingIndicator | Styles applied to the loadingIndicator element. |
| loadingIndicatorCenter | .MuiLoadingButton-loadingIndicatorCenter | Styles applied to the loadingIndicator element if loadingPosition="center". |
| loadingIndicatorStart | .MuiLoadingButton-loadingIndicatorStart | Styles applied to the loadingIndicator element if loadingPosition="start". |
| loadingIndicatorEnd | .MuiLoadingButton-loadingIndicatorEnd | Styles applied to the loadingIndicator element if loadingPosition="end". |
| endIconLoadingEnd | .MuiLoadingButton-endIconLoadingEnd | Styles applied to the endIcon element if loading={true} and loadingPosition="end". |
| startIconLoadingStart | .MuiLoadingButton-startIconLoadingStart | Styles applied to the startIcon element if loading={true} and loadingPosition="start". |
您可以使用组件自定义选项对组件进行个性化：
- 具备 全局类名.
- 在自定义主体中，设定一个规则名称作为组件的
styleOverrides属性的一部分。