useTableColumnResize
@astryxdesign/core v0.7.1 · useTableColumnResize
参数
useTableColumnResize() 只接一个配置对象。宽度存在 ref 里时用 getter 包一层,表格每次读都能拿到最新的值:useTableColumnResize(() => ({ ... }))。
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
columnWidths | Record<string, number> | {} | 已经提交的像素宽度,键是列 key。有值时覆盖列自己声明的宽度。 |
onColumnResizeEnd | (updates: Record<string, number>) => void | — | 一次拖动结束(松开指针或按键)时调用。参数是「列 key → 新宽度」的映射,包含所有宽度变了的列,把它并进 columnWidths 就是新的状态。最后一列不在里面,它的宽度跟着剩余空间走。 |
minWidth | number | — | 拖动时所有列共用的最窄像素,一设就盖过每一列自己的下限。 |
maxWidth | number | Infinity | 拖动时所有列共用的最宽像素。 |
columns | readonly TableColumn<T>[] | — | 列定义。用来取每一列的下限,并区分比例列和固定像素列,好决定相邻列和最后一列怎么动。表格自己会传,只有自己调下面的辅助函数时才需要给。 |
返回值
useTableColumnResize() 返回一个 TablePlugin<T>,放进 Table 的 plugins 里。它填的是插件约定里的三个字段:
| 名称 | 类型 | 说明 |
|---|---|---|
widthFor | (column: TableColumn<T>) => number | undefined | 返回某一列已经提交的宽度,没有就返回 undefined。 |
resizeFor | (column: TableColumn<T>, columns: readonly TableColumn<T>[]) => TableColumnResizeContribution | null | 说明一列怎么参与拖动:当前宽度、最窄、最宽、让出宽度的相邻列,以及这一列有没有把手。 |
onColumnResizeEnd | (updates: Record<string, number>) => void | Table 把变了的列交给它。它把宽度取整到整像素,再转给你的 onColumnResizeEnd。 |
辅助函数
同一个模块也导出插件内部用的计算函数,自己的界面需要算宽度时可以直接用。
| 名称 | 类型 | 说明 |
|---|---|---|
columnResizeMinWidth | (width: ColumnWidth | undefined, globalMinWidth?: number) => number | 一列能拖到的最窄像素:设了全局下限就用它,否则用列自己的下限。 |
isProportionalColumnWidth | (width: ColumnWidth | undefined) => boolean | 比例列和没写宽度的列都算比例列。 |
resizeColumnWidths | (plan: ColumnResizePlan, delta: number) => number[] | 把指针位移(像素)套到一组列宽快照上,返回算好的每一列宽度。 |
columnResizeStep | (isShiftKey: boolean) => number | 按一下方向键走多少像素:10px,按住 Shift 是 50px。 |
columnResizeDirectionSign | (direction: string) => 1 | -1 | 横向位移在书写方向上的符号。RTL 返回 -1。 |