ant-design / ant-design/pro-components
🧐[问题]ProTable列设置的拖动列位置会覆盖columns设置的fixed值
- Dominant language
- TypeScript
- Stars
- 4.8k
- Forks
- 1.4k
- Avg merge
- 10h 44m
- Merged PRs (30d)
- 3
Description
### 🧐 问题描述
依赖如下:
```
"@ant-design/pro-components": "^2.8.10",
"react": "18.3.1",
"react-dom": "18.3.1",
"antd": "^5.29.2"
```
页面加载完成后,我点击列设置,并拖动“创建时间”到“更新时间”后,想要改变列的位置,拖动结束后,“测试11”和“操作”列没有固定在最初的位置了。看localStorage存的值对应字段也没有fixed的值。针对dataIndex是数组的,存储的key存在“test-test1”和“test.test1”两种。
最终我希望拖动后“测试11”和“操作”列能保持之前的展示,固定在之前的位置。
### 💻 代码
```
import type { ActionType, ProColumns } from "@ant-design/pro-components";
import { ProTable, TableDropdown } from "@ant-design/pro-components";
import { useRef } from "react";
import request from "umi-request";
type GithubIssueItem = {
id: number;
test: {
test1: string;
test2: string;
};
created_at: string;
updated_at: string;
};
const columns: ProColumns[] = [
{
title: "测试11",
dataIndex: ["test", "test1"],
fixed: "left",
},
{
title: "测试22",
dataIndex: ["test", "test2"],
ellipsis: true,
},
{
title: "创建时间",
dataIndex: "created_at",
sorter: true,
},
{
title: "更新时间",
dataIndex: "update_at",
},
{
title: "操作",
dataIndex: "option",
fixed: "right",
render: (text, record, _, action) => [
{
action?.startEditable?.(record.id);
}}
>
编辑
,
],
},
];
const Demo = () => {
const actionRef = useRef();
return (
columns={columns}
actionRef={actionRef}
cardBordered
columnsState={{
persistenceKey: "pro-table-singe-demos",
persistenceType: "localStorage",
onChange: (values) => {
console.log("onChange values", values);
},
}}
rowKey="id"
dataSource={[
{
id: 1111111,
test: {
test1: "wwwwwwwwww",
test2: "LS1111111111",
},
},
]}
columnsState={{
onChange: (values) => {
console.log("va", values);
},
persistenceKey: "wwww",
persistenceType: "localStorage",
}}
/>
);
};
export default () => (
);
```
### 🚑 其他信息
Contributor guide
Research direction
Start by reproducing the provided ProTable example with columnsState persistence enabled, then inspect the columnsState handling for drag ordering and localStorage keys. Verify how array dataIndex values are normalized and whether fixed columns retain their original positions after reordering; done means both fixed columns remain fixed and persisted state uses a consistent key.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 55/100