SuperAPI AI 工具集

tanstack-solid-table-with-tanstack-virtual

前端与建站

查看项目

更新于 10-16 00:02

技能介绍

用途:在 Solid 渲染层对 TanStack Table 的最终 Table 模型做虚拟化,配合无限查询数据滚动。Virtual 不是 Table 的功能,需在渲染器侧虚拟化最终模型。

主要能力:使用 @tanstack/solid-virtual 的 createVirtualizer 配置 count、getScrollElement、estimateSize、getItemKey、overscan;支持响应式行数、稳定 key、动态测量与滚动目标。

必要用法:count 必须用 getter 保持响应式,如 get count() { return rows().length };行数据应取 table.getRowModel().rows,而非原始 data(),以包含排序、过滤、分组、展开与分页结果;滚动元素 ref 与 virtualizer 放在同一 owner,getScrollElement 返回 scrollElement ?? null;渲染时需应用几何样式,如 tbody 设 height 为 virtualizer.getTotalSize() 与 position: relative,行设 position: absolute 与 transform: translateY(item.start px),并用 virtualizer.measureElement(node) 测量。

适用场景:Solid 中大数据量表格的行/列虚拟化与无限滚动。

限制:资料未提供安装命令、版本要求、收费与平台信息;API 细节需查看 node_modules/@tanstack/solid-table/dist/index.d.ts 与 node_modules/@tanstack/solid-virtual/dist/,并参考对应行、列或无限示例的 CSS 几何约定。