我有一个要渲染的对象，每行 8 个项目。每渲染完第 8 个项目，我就会关闭行 div 并开始新行。这是我的代码
<div class="usage-row">
{cpu.map((item, index) => (
<>
<div class="cpu">
<i class={`bi bi-circle-fill ${item.description} led`}></i>
CPU {item.realname}
</div>
{index % 8 === 7 && </div><div class="usage-row">}
</>
))};
</div>
这在编译时失败了，我不知道为什么。每个 div 都关闭了。括号和圆括号都检查出来了。有人能向我解释一下发生了什么吗？