Reactjs 如何在React material中的列表项之间创建空间

我学习了React Material，我想在React Material

列表中的每一行之间留出空间，但我不知道如何做到这一点

我读了很多书，但是我想不出来，因为我是个新手

我试着这样做：

  <li className="list-group-item" key={el.id}>
                {el.title}
            </li>

列表中有一行：

 <book id="13543">
    <author>Roger, more</author>
    <title>Helping hand club</title>
    <genre>Space</genre>
    <price>234.00</price>
  </book>


罗杰，还有
帮手俱乐部
空间
234
您可以使用
CSS
执行此操作

const styles = theme => ({
    root: {
        //Your existing styles
        margin: 5px 0;
    },
});

iirc你可以像这样从material ui导入多个组件：
import{Button，Avatar…}从@material ui/core导入
谢谢，我知道它看起来很乱，因为我知道：）我想在每行之间留一个空间。我认为您的代码在每个列表项上都有一个空格。我每行有4个列表项。很抱歉，我的Q不清楚。您可以为
ListItemText
组件应用相同的样式。发布您的
ListItemText
组件，以便我们能够提供帮助。我添加了
ListItemText
主要标题类似于“作者”，次要内容类似于“罗杰·莫尔”，删除了我从
styles
以及
中建议的样式。谢谢确定，这很简单：）
const styles = theme => ({
    root: {
        //Your existing styles
        margin: 5px 0;
    },
});