材质 UI 网格列表项间距

Question

我是 Material UI 的新手，但我想增加网格列表中图像图块之间的间距，我已按照 Material UI 文档中的示例进行操作，并在 Stack Overflow 中搜索了类似的示例，但没有找到答案。任何对资源的帮助或指导将不胜感激。

Answer 1

2024 年答案

TL;DR

：使用 ImageList 的

gap

属性来代替。

Details

：标记的答案是错误的，

gap

是调整间距的道具，可以在最新的MUI React Documentation中找到。同样过时的是评论，指出“间距”是解决挑战的方法。

Example of use

：

<ImageList rowHeight={200} gap={8}>
  {itemData.map((item) => (
    <ImageListItem key={item.img}>
      <img src={item.img} alt={item.title} />
    </ImageListItem>
  ))}
</ImageList>

Answer 2

使用网格列表组件上的

padding

属性：

<GridList
  padding={20}
/>

在文档中阅读更多相关内容。另外，单击右上角的 <> 图标查看示例的代码。

更新： 新道具现在称为

spacing

。