nicegui 默认表格会显示列标题（`

`），若需完全隐藏表头，可通过 `props` 方法注入 quasar 的 `table-header-class="hidden"` 属性实现，无需修改列定义或使用 css 注入。

在 NiceGUI 中，ui.table 基于 Quasar Framework 的 <q-table> 组件构建，其样式与行为高度依赖 Quasar 的属性系统。虽然文档未显式列出 table-header-class 这一 prop，但它属于 Quasar <q-table> 的原生支持属性，可直接通过 .props() 方法传入。

要隐藏表头（即不渲染 <thead> 及其中所有 <th> 元素），只需在创建表格时添加：

ui.table(columns=columns, rows=rows, row_key='name').props('table-header-class=hidden')

⚠️ 注意：table-header-class="hidden" 并非通过 CSS 隐藏（如 display: none），而是由 Quasar 内部逻辑识别后跳过表头渲染，因此更轻量、语义更清晰，且不会影响列宽自动计算或响应式行为。

CSS婚礼策划服务机构宣传网站模板

CSS婚礼策划服务机构宣传网站模板是一款适合提供婚礼策划和婚庆服务机构宣传网站模板下载。提示：本模板调用到谷歌字体库，可能会出现页面打开比较缓慢。

下载

✅ 正确示例（完整可运行）：

from nicegui import ui

columns = [
    {'name': 'name', 'label': 'Name', 'field': 'name', 'required': True, 'align': 'left'},
    {'name': 'age', 'label': 'Age', 'field': 'age', 'sortable': True},
]
rows = [
    {'name': 'Alice', 'age': 18},
    {'name': 'Bob', 'age': 21},
    {'name': 'Carol'},
]

# 隐藏表头的关键：使用 props 注入 table-header-class=hidden
ui.table(columns=columns, rows=rows, row_key='name').props('table-header-class=hidden')

ui.run()

? 补充说明：

• 该方法不影响列排序（sortable: True）、筛选或行点击等交互功能；
• 若后续需动态切换表头显隐，可结合 table.element.update() 或使用 ui.timer + 状态变量控制（需手动触发重渲染）；
• 不推荐用 .classes('hidden') 或自定义 CSS 覆盖，因可能干扰 Quasar 内部布局逻辑（如固定列、虚拟滚动等）。

总之，props('table-header-class=hidden') 是 NiceGUI 中隐藏表格表头最简洁、兼容性最佳的官方推荐方式。