diff --git a/docs/3.md b/docs/3.md index 67e9539..893ffdf 100644 --- a/docs/3.md +++ b/docs/3.md @@ -13,6 +13,7 @@ - 新增 `refresh` 方法,用于手动刷新组件 - 新增 `debounceWaitTime`,用于设置 resize窗口时 debounce 的等待时间 +- `resetColumns` 新增入参 `resetStorage` 选项,可以重置storage中的列宽度,默认为 `true` - 可给单独列设置以下选项 ```tsx type ResizableConfig = { diff --git a/playground/app/routes/_layout/basic/index.tsx b/playground/app/routes/_layout/basic/index.tsx index 0eca0f6..73a3f81 100644 --- a/playground/app/routes/_layout/basic/index.tsx +++ b/playground/app/routes/_layout/basic/index.tsx @@ -103,6 +103,10 @@ export function Component() { const { components, resizableColumns, tableWidth, resetColumns } = useAntdResizableHeader({ columns: useMemo(() => columns, [times]), + columnsState: { + persistenceKey: 'basic', + persistenceType: 'sessionStorage', + }, }) return ( diff --git a/src/hooks/useLocalColumns.ts b/src/hooks/useLocalColumns.ts index 086d8c9..042795f 100644 --- a/src/hooks/useLocalColumns.ts +++ b/src/hooks/useLocalColumns.ts @@ -102,8 +102,8 @@ function useLocalColumns({ }, [resizableColumns]) // reset - const resetLocalColumns = useMemoizedFn(() => { - setLocalColumns([...(columnsProp || [])]) + const resetLocalColumns = useMemoizedFn((resetStorage: boolean = true) => { + setLocalColumns([...((resetStorage ? columns : columnsProp) || [])]) }) return { diff --git a/src/useAntdResizableHeader.tsx b/src/useAntdResizableHeader.tsx index 028dd3d..fc092d5 100644 --- a/src/useAntdResizableHeader.tsx +++ b/src/useAntdResizableHeader.tsx @@ -46,9 +46,9 @@ function useAntdResizableHeader s + 1, 0) - const resetColumns = useMemoizedFn(() => { + const resetColumns = useMemoizedFn((resetStorage: boolean = true) => { widthCache.current = new Map() - resetLocalColumns() + resetLocalColumns(resetStorage) }) const _onResizeEnd = useMemoizedFn((id?: string | number) => (width: number) => {