SuperAPI AI 工具集

tanstack-table-core-global-filtering

前端与建站

查看项目

更新于 10-16 05:44

技能介绍

用途:在 TanStack Table Core 中实现全局过滤,复用列过滤管线,对整个表格按全局关键字筛选数据,并支持手动服务端过滤。

主要能力与依赖:全局过滤依赖列过滤能力与 filteredRowModel。需同时启用 columnFilteringFeature、globalFilteringFeature 并提供 createFilteredRowModel()、filterFns。示例:import { columnFilteringFeature, createFilteredRowModel, filterFn_includesString, globalFilteringFeature, tableFeatures } from '@tanstack/table-core';features = tableFeatures({ columnFilteringFeature, globalFilteringFeature, filteredRowModel: createFilteredRowModel(), filterFns: { includesString: filterFn_includesString } })。

核心配置:可在选项中使用 globalFilterFn: 'includesString' 与 getColumnCanGlobalFilter 判定列是否参与全局过滤。默认按首行核心数据判断资格,接受字符串或数值列。

手动服务端过滤:设置 manualFiltering: true 时会绕过客户端过滤模型,需将过滤值用于服务端请求,例如 const page = await fetchRows({ search }); 并以返回数据作为 data,同时保留该选项。

常见错误:漏掉列过滤前置特征;假设所有列都参与(动作列等可用 getColumnCanGlobalFilter 排除);手动过滤时只在本地 setGlobalFilter 而未驱动请求。

限制:资料未提供安装命令、具体版本、平台差异与收费信息。