MobileStepper API

想要学习更多组件属性和 CSS API，可以查阅 React MobileStepper 组件的 API 文档。

导入

import MobileStepper from '@mui/material/MobileStepper';
// 或
import { MobileStepper } from '@mui/material';

在主题中，名称“MuiMobileStepper”可用于提供默认属性（props），或者样式覆盖

Paper 组件的属性也是可用的。

名称	类型	默认值	描述
steps^*	integer		The total steps.
activeStep	integer	0	Set the active step (zero based index). Defines which dot is highlighted when the variant is 'dots'.
backButton	node		A back button element. For instance, it can be a `Button` or an `IconButton`.
classes	object		Override or extend the styles applied to the component. See CSS API below for more details.
LinearProgressProps	object		Props applied to the `LinearProgress` element.
nextButton	node		A next button element. For instance, it can be a `Button` or an `IconButton`.
position	'bottom' \| 'static' \| 'top'	'bottom'	Set the positioning type.
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	'dots' \| 'progress' \| 'text'	'dots'	The variant to use.

ref 则会被传递到根元素中。

尽管上文没有明文记录， Paper 组件的属性(props) 在组件MobileStepper上同样是可用的。你可以利用这一点来指向嵌套组件

规则名称	全局类名	描述
root	.MuiMobileStepper-root	Styles applied to the root element.
positionBottom	.MuiMobileStepper-positionBottom	Styles applied to the root element if `position="bottom"`.
positionTop	.MuiMobileStepper-positionTop	Styles applied to the root element if `position="top"`.
positionStatic	.MuiMobileStepper-positionStatic	Styles applied to the root element if `position="static"`.
dots	.MuiMobileStepper-dots	Styles applied to the dots container if `variant="dots"`.
dot	.MuiMobileStepper-dot	Styles applied to each dot if `variant="dots"`.
dotActive	.MuiMobileStepper-dotActive	Styles applied to a dot if `variant="dots"` and this is the active step.
progress	.MuiMobileStepper-progress	Styles applied to the Linear Progress component if `variant="progress"`.

您可以使用组件自定义选项对组件进行个性化：