为什么捐赠
API 探索器
标记表

QMarkupTable 允许您简单地将原生 <table> 标记包装起来,使其看起来像一个 Material Design 表格。

提示

对于分页、排序、过滤等更高级的功能,您可能需要查看 QTable 组件。

正在加载 QMarkupTable API...

用法

警告

请注意,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>
基本



分隔符



强制深色模式



自定义



提示

如果您想删除某些行或某些单元格的悬停效果,请向其添加 q-tr--no-hoverq-td--no-hover 类。