如何构建组件在React或Vue中的表内渲染多行

Question

只想知道我是否构建用于呈现部分表行的组件，该怎么办？

<table>
  <thead>
      <tr><td>Col 1</td><td>Col 2</td></tr>
  </thead>
  <tbody>
      <partialrows :data="dataset1" />
      <partialrows :data="dataset2" />
   </tbody>
</table>

我希望每个partialrows渲染几行

<tr><td colspan=2>title ds 1</td></tr>
<tr><td>ds01</td><td>ds02</td></tr>
<tr><td>ds11</td><td>ds12</td></tr>
<tr><td>ds21</td><td>ds22</td></tr>

但是这违反了单一根元素规则，我想知道如何在React或Vue中解决这个问题？

谢谢

Answer 1

在Vue中，您可以使用functional component或vue-fragments。看看this article。

在React中，也有fragments。