QMarkupTable 讓您能夠簡單地包裝原生的 <table>
,使其看起來像 Material Design 表格。
提示
若要使用進階功能,例如分頁、排序、篩選等等,您可能需要改為查看 QTable 元件。
用法
警告
請注意,QMarkupTable
的內容準確地反映了原生 HTML <table>
的標記表示,必須具有 <thead>
和 <tbody>
來包裝標頭和表格主體。 這是必需的。
UMD 開發人員
此元件在 Quasar 的 UMD 版本中 *無法* 直接使用。 瀏覽器會在 Vue 啟動並渲染之前解析範本 HTML,因此標記必須正確。 <q-markup-table> <thead>
或 <q-markup-table> <tbody>
是不正確的。 解決方案是將內容包裝在 <template>
中,如下所示
<q-markup-table>
<template>
<!-- your content -->
</template>
</q-markup-table>
content_paste
提示
如果您想移除某些列或某些儲存格的懸停效果,請將 q-tr--no-hover
或 q-td--no-hover
類別新增至它們。