diff --git a/playground/app/routes/_layout+/_layout.tsx b/playground/app/routes/_layout+/_layout.tsx
index 2dc10f4..74d8f0d 100644
--- a/playground/app/routes/_layout+/_layout.tsx
+++ b/playground/app/routes/_layout+/_layout.tsx
@@ -14,6 +14,10 @@ export default function () {
+
+
+
+
diff --git a/playground/app/routes/_layout+/row-selection-order/index.tsx b/playground/app/routes/_layout+/row-selection-order/index.tsx
new file mode 100644
index 0000000..a46365e
--- /dev/null
+++ b/playground/app/routes/_layout+/row-selection-order/index.tsx
@@ -0,0 +1,131 @@
+import { useMemo, useState } from 'react'
+import { Button, Table, type TableColumnsType, Tag } from 'antd'
+import { type ResizableColumnsType, useAntdResizableHeader } from 'use-antd-resizable-header'
+
+interface DataType {
+ key: string
+ name: string
+ age: number
+ address: string
+ tags: string[]
+}
+
+type Columns = ResizableColumnsType>
+
+const data: DataType[] = [
+ {
+ key: '1',
+ name: 'John Brown',
+ age: 32,
+ address: 'New York No. 1 Lake Park',
+ tags: ['nice', 'developer'],
+ },
+ {
+ key: '2',
+ name: 'Jim Green',
+ age: 42,
+ address: 'London No. 1 Lake Park',
+ tags: ['loser'],
+ },
+ {
+ key: '3',
+ name: 'Joe Black',
+ age: 32,
+ address: 'Sydney No. 1 Lake Park',
+ tags: ['cool', 'teacher'],
+ },
+]
+
+export function Component() {
+ const [times, setTimes] = useState(0)
+
+ const columns: Columns = [
+ {
+ title: 'Name',
+ width: 300,
+ dataIndex: 'name',
+ key: 'name',
+ // 设置拖拽最小宽度
+ minConstraints: 20,
+ render: (text) => {text},
+ },
+ Table.SELECTION_COLUMN,
+ {
+ title: 'Age',
+ dataIndex: 'age',
+ key: 'age',
+ width: 100,
+ },
+ {
+ title: 'Address',
+ dataIndex: 'address',
+ key: 'address',
+ width: 100,
+ },
+ {
+ title: 'Tags',
+ key: 'tags',
+ dataIndex: 'tags',
+ render: (_, { tags }) => (
+ <>
+ {tags.map((tag) => {
+ let color = tag.length > 5 ? 'geekblue' : 'green'
+ if (tag === 'loser') {
+ color = 'volcano'
+ }
+ return (
+
+ {tag.toUpperCase()}
+
+ )
+ })}
+ >
+ ),
+ width: 300,
+ },
+ {
+ title: 'Action',
+ key: 'action',
+ render: (_, record) => (
+
+ ),
+ },
+ ]
+
+ const { components, resizableColumns, tableWidth, resetColumns } = useAntdResizableHeader({
+ columns: useMemo(() => columns, [times]),
+ columnsState: {
+ persistenceKey: 'row-selection-order',
+ persistenceType: 'sessionStorage',
+ },
+ })
+
+ return (
+
+
+
+
+ )
+}
diff --git a/src/hooks/useLocalColumns.ts b/src/hooks/useLocalColumns.ts
index a3295e8..c5b92d4 100644
--- a/src/hooks/useLocalColumns.ts
+++ b/src/hooks/useLocalColumns.ts
@@ -24,6 +24,10 @@ function mergeColumns(src: T, target: T, mergeK
const resDataIndex = Array.isArray(res[i].dataIndex) ? res[i].dataIndex.join('-') : res[i].dataIndex
return targetDataIndex === resDataIndex
})?.[mergeKey] || res[i][mergeKey]
+ // {} 有可能修改成 { [mergeKey]: undefined },影响 Table.SELECTION_COLUMN 和 Table.EXPANDABLE_COLUMN 的判断
+ if (res[i][mergeKey] === undefined) {
+ delete res[i][mergeKey]
+ }
}
})
}