跳到主要内容跳到主要内容

工具栏API

React 工具栏组件的 API 参考文档。了解此导出模块的 props、CSS 和其他 API。

示例

导入

import Toolbar from '@mui/material/Toolbar';
// or
import { Toolbar } from '@mui/material';

阅读这篇关于最小化 bundle size 的指南,了解它们之间的区别。

属性

原生组件的属性也可用。

名称类型默认值描述
children节点-

工具栏的 children,通常是 IconButtonButtonTypography 的混合。工具栏是一个 flex 容器,允许使用 flex item 属性来布局 children。

classes对象-

覆盖或扩展应用于组件的样式。

有关更多详细信息,请参阅下面的 CSS 类 API。

component元素类型-

用于根节点的组件。可以是用于 HTML 元素的字符串或组件。

disableGutters布尔值

如果为 true,则禁用 gutter 内边距。

sxArray<func
| object
| bool>
| func
| object
-

允许定义系统覆盖以及其他 CSS 样式的系统 prop。

有关更多详细信息,请参阅 “sx” 页面。

variant'dense'
| 'regular'
| string
'regular'

要使用的变体。

`ref` 被转发到根元素。

主题默认属性

您可以使用 `MuiToolbar` 通过主题更改此组件的默认属性。

CSS 类

这些类名对于使用 CSS 进行样式设置很有用。当特定状态被触发时,它们会应用于组件的插槽。

类名规则名称描述
.MuiToolbar-densedense如果 variant="dense"`,则应用于根元素的样式。
.MuiToolbar-guttersgutters除非 `disableGutters={true}`,否则应用于根元素的样式。
.MuiToolbar-regularregular如果 variant="regular"`,则应用于根元素的样式。
.MuiToolbar-rootroot应用于根元素的样式。

您可以使用以下自定义选项之一覆盖组件的样式

  • 使用全局类名。
  • 在自定义主题中,使用作为组件 styleOverrides 属性一部分的规则名称。

源代码

如果您在此页面中没有找到所需的信息,请考虑查看组件的实现以获取更多详细信息。