跳到主要内容跳到主要内容
🚀 影响 Material UI 2025 年路线图！参与最新的开发者调查

ImageListItemBarAPI

React ImageListItemBar 组件的 API 参考文档。了解此导出的模块的属性、CSS 和其他 API。

示例

导入

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

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

属性

原生组件的属性也可用。

名称类型默认值描述
actionIconnode-

用作辅助操作目标的 IconButton 元素（主要操作目标是项目本身）。

actionPosition'left'
| 'right'		'right'

辅助操作 IconButton 的位置。

classesobject-

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

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

position'below'
| 'bottom'
| 'top'		'bottom'

标题栏的位置。

subtitlenode-

用作副标题（辅助文本）的字符串或元素。

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

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

有关更多详细信息，请参见 `sx` 页面。

titlenode-

要显示的标题。

ref 被转发到根元素。

主题默认属性

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

CSS 类

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

类名规则名称描述
.MuiImageListItemBar-actionIconactionIcon如果提供，则应用于 actionIcon 的样式。
.MuiImageListItemBar-actionIconActionPosLeftactionIconActionPosLeft如果 actionPosition="left"，则应用于 actionIcon 的样式。
.MuiImageListItemBar-actionPositionLeftactionPositionLeft如果 actionPosition="left"，则应用于操作容器元素的样式。
.MuiImageListItemBar-actionPositionRightactionPositionRight如果 actionPosition="right"，则应用于操作容器元素的样式。
.MuiImageListItemBar-positionBelowpositionBelow如果 position="below"，则应用于根元素的样式。
.MuiImageListItemBar-positionBottompositionBottom如果 position="bottom"，则应用于根元素的样式。
.MuiImageListItemBar-positionToppositionTop如果 position="top"，则应用于根元素的样式。
.MuiImageListItemBar-rootroot应用于根元素的样式。
.MuiImageListItemBar-subtitlesubtitle应用于副标题容器元素的样式。
.MuiImageListItemBar-titletitle应用于标题容器元素的样式。
.MuiImageListItemBar-titleWraptitleWrap应用于标题和副标题容器元素的样式。
.MuiImageListItemBar-titleWrapActionPosLefttitleWrapActionPosLeft如果 actionPosition="left"，则应用于容器元素的样式。
.MuiImageListItemBar-titleWrapActionPosRighttitleWrapActionPosRight如果 actionPosition="right"，则应用于容器元素的样式。
.MuiImageListItemBar-titleWrapBelowtitleWrapBelow如果 position="below"，则应用于标题和副标题容器元素的样式。

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

源代码

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