Vue Table
@tanstack/vue-table 适配器是对核心表格逻辑的封装。它主要负责以 “Vue 方式” 管理状态、提供类型以及实现单元格/表头/表尾模板的渲染。
导出 (Exports)
@tanstack/vue-table 重新导出了所有 @tanstack/table-core 的 API 以及以下内容:
useVueTable
接受一个 options 对象并返回一个表格实例。
import { useVueTable } from '@tanstack/vue-table'
const table = useVueTable(options)
// ...渲染你的表格
FlexRender
一个 Vue 组件,用于渲染带有动态值的单元格/表头/表尾模板。
示例:
<template>
<tbody>
<tr v-for="row in table.getRowModel().rows" :key="row.id">
<td v-for="cell in row.getVisibleCells()" :key="cell.id">
<FlexRender
:render="cell.column.columnDef.cell"
:props="cell.getContext()"
/>
</td>
</tr>
</tbody>
</template>