如何在类星表中制作字幕

Question

我在用类星体/cli开发Vue3。

如何使用类星体组件qTable或qMarkupTable制作此类别分隔符(蓝色字幕)？屏幕

我试着找出身体的插槽，但我做不到

链接到qTable API文档https://quasar.dev/vue-components/table#introduction

链接到qMarkupTable API文档https://quasar.dev/vue-components/markup-table#introduction

Answer 1

对于QMarkupTable，添加TD跨越所有列的行：

<q-markup-table>
  <thead>
    <tr>
      <th>№</th>
      <th>Name</th>
      <th>Code</th>
      <th>Diff</th>
    </tr>
  </thead>
  <tbody>
    <tr class="bg-primary text-white">
      <td colspan="4">Medicines</td>
    </tr>
    <tr>
      <td>1</td>
      <td>Mukosolvan</td>
      <td>101492</td>
      <td class="text-negative">1</td>
    </tr>
  </tbody>
</q-markup-table>

QMarkupTable是一个普通的HTML表--它只是在其上应用适当的样式，其他的一切都是您作为学生学习过的HTML。