useTableColumnSettings
@astryxdesign/core v0.7.1 · useTableColumnSettings
参数
useTableColumnSettings() 只接一个配置对象。key 存在 ref 里时用 getter 包一层,表格每次读都能拿到最新的值:useTableColumnSettings(() => state.columnSettingsConfig)。
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
columns | readonly ColumnSettingsOption<TColumnKey>[] | — | 必填。全部可选的列,带设置界面要用的信息。每一项有 key、label,还可以有 isAlwaysVisible 和 group。 |
activeColumnKeys | readonly TColumnKey[] | — | 必填。当前打开的列 key,按显示顺序。只有 key 在这个数组里的列会显示。 |
onChangeActiveColumnKeys | (keys: TColumnKey[]) => void | — | 打开的列变了时调用。useTableColumnSettings() 自己不会调它;它属于 useTableColumnSettingsState() 交回来的那份配置。 |
defaultColumnKeys | readonly TColumnKey[] | — | 「恢复默认」用的那组列。不传就恢复成全部列。 |
返回值
useTableColumnSettings() 返回一个 TablePlugin<T>,放进 Table 的 plugins 里。它填的是插件约定里的一个字段:
| 名称 | 类型 | 说明 |
|---|---|---|
transformColumns | (columns: TableColumn<T>[]) => TableColumn<T>[] | 丢掉 key 不在 activeColumnKeys 里的列,再把剩下的按这个数组的顺序排好。 |
useTableColumnSettingsState
配套的组合式函数。它替你拿住这些 key,所有写入都走它,所以 isAlwaysVisible 的列不会被删掉。
ts
const state = useTableColumnSettingsState({
columns: columnOptions,
activeColumnKeys: activeKeys,
onChangeActiveColumnKeys(keys) {
activeKeys.value = [...keys]
},
})
const plugin = useTableColumnSettings(state.columnSettingsConfig)参数和上面那份配置一样,另外多一个 defaultColumnKeys。
| 名称 | 类型 | 说明 |
|---|---|---|
activeColumnKeys | readonly TColumnKey[] | 你传进来的 key,每次读都重新取值。 |
toggleColumn | (key: TColumnKey) => void | 开关一列。isAlwaysVisible 的 key 会被忽略。 |
isColumnActive | (key: TColumnKey) => boolean | 这一列现在是打开的吗。用来勾选选择器里的选项。 |
isColumnToggleable | (key: TColumnKey) => boolean | 这一列允许被关掉吗。isAlwaysVisible 的列是 false,选择器里把它标成禁用。 |
showAllColumns | () => void | 把 columns 里的全部列报成打开。 |
resetToDefault | () => void | 报出 defaultColumnKeys,没设就报出全部列。「恢复默认」按钮调它。 |
setActiveColumnKeys | (keys: readonly TColumnKey[]) => void | 把给的 key 补上所有 isAlwaysVisible 的 key 再报出去,然后调 onChangeActiveColumnKeys。 |
columnSettingsConfig | UseTableColumnSettingsConfig<TColumnKey> | 给 useTableColumnSettings() 用的配置,写入接到 setActiveColumnKeys,并带上 defaultColumnKeys。 |
ColumnSettingsOption
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
key | TColumnKey | — | 列的 key,必须和某个 TableColumn.key 一致。 |
label | string | — | 设置界面里显示的名字。 |
isAlwaysVisible | boolean | false | 这一列不能被隐藏。用在 Name、ID 这种必须留着的列上。 |
group | string | — | 分组名。同组的列在设置列表里排在一起,可以带个小标题。 |