DashboardLayoutAPI
React DashboardLayout 组件的 API 参考文档。了解此导出模块的 props、CSS 和其他 API。
演示
导入
import { DashboardLayout } from '@toolpad/core/DashboardLayout';
// or
import { DashboardLayout } from '@toolpad/core';原生组件的 Props 也可用。
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| children* | node | - | 仪表盘的内容。 |
| branding | { homeUrl?: string, logo?: node, title?: string } | null | 仪表盘的品牌选项。 |
| defaultSidebarCollapsed | bool | false | 侧边栏是否应在桌面尺寸屏幕中开始折叠。 |
| disableCollapsibleSidebar | bool | false | 侧边栏是否不应在桌面和平板电脑视口中折叠为迷你变体。 |
| hideNavigation | bool | false | 是否应隐藏导航栏和菜单图标 |
| navigation | Array<{ action?: node, children?: Array<object | { kind: 'header', title: string } | { kind: 'divider' }>, icon?: node, kind?: 'page', pattern?: string, segment?: string, title?: string } | { kind: 'header', title: string } | { kind: 'divider' }> | [] | 仪表盘的导航定义。了解更多。 |
| sidebarExpandedWidth | number | string | 320 | 展开时侧边栏的宽度。 |
| slotProps | { appTitle?: { branding?: { homeUrl?: string, logo?: node, title?: string } }, sidebarFooter?: { mini: bool }, toolbarAccount?: { localeText?: object, slotProps?: { popover?: object, popoverContent?: object, preview?: object, signInButton?: object, signOutButton?: object }, slots?: { popover?: elementType, popoverContent?: elementType, preview?: elementType, signInButton?: elementType, signOutButton?: elementType } }, toolbarActions?: object } | {} | 每个插槽内部使用的 props。 |
| slots | { appTitle?: elementType, sidebarFooter?: elementType, toolbarAccount?: elementType, toolbarActions?: elementType } | {} | 每个插槽内部使用的组件。 有关更多详细信息，请参见下方的 Slots API。 |
| sx | Array<func | object | bool> | func | object | - | 允许定义系统覆盖以及其他 CSS 样式的系统 prop。 有关更多详细信息，请参见 `sx` 页面。 |
该组件无法持有 ref。
| 插槽名称 | 类名 | 默认组件 | 描述 |
|---|---|---|---|
| appTitle | Link | 用于布局标题中的应用标题部分的组件。 | |
| toolbarActions | ToolbarActions | 在布局标题中使用的工具栏操作组件。 | |
| toolbarAccount | 账户 | 在布局标题中使用的工具栏帐户组件。 | |
| sidebarFooter | null | 在布局侧边栏中使用的可选页脚组件。 |
源代码
如果您在此页面中找不到信息，请考虑查看组件的实现以获取更多详细信息。