SuperAPI AI 工具集

tanstack-table-core-column-resizing

前端与建站

查看项目

更新于 10-16 00:02

技能介绍

用途:该技能基于 core、table-features 与 column-sizing,为 TanStack Table 提供列宽拖拽调整能力。调整功能提供手势 API 与状态,渲染层负责手柄与列宽。主要能力:通过 columnResizingFeature 接入列宽调整,使用 header.getResizeHandler() 获取事件处理器,配置 columnResizeMode(如 onChange)与 columnResizeDirection(如 ltr)。用法:先注册特性,代码为 tableFeatures({ columnSizingFeature, columnResizingFeature })。获取处理器 const handler = header.getResizeHandler(),再绑定 handle.addEventListener('mousedown', handler) 和 handle.addEventListener('touchstart', handler)。大数据网格建议每次更新时统一计算可见尺寸并暴露为 CSS 变量,而非逐单元格读取尺寸。限制与注意:不能省略 sizing 前置特性,否则 resizing 无法工作;只用 pointerdown 无法提供可用的触摸调整,需同时绑定 mouse 与 touch start 事件;应使用 CSS 变量缓存尺寸以避免 onChange 调整时重复计算。事件绑定与兼容细节请以官方文档为准,其他平台支持情况暂未提供。