fix(DragSortTable): demo 拖动排序后报错 (#8158)

* fix(DragSortTable): onDragSortEnd 方法中 newDataSource 取值错误 * fix(DragSortTable): 删除 demo 中模拟数据中多余的 index 字段 * fix(DragSortTable): demo 隐藏搜索表单
ant-design · Feb 21, 2024 · 3920e86 · 3920e86
1 parent c89d4b1
commit 3920e86
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 11 deletions.
diff --git a/packages/table/src/components/DragSortTable/demos/drag-sort-table.tsx b/packages/table/src/components/DragSortTable/demos/drag-sort-table.tsx
@@ -10,21 +10,18 @@ const data = [
     name: 'John Brown',
     age: 32,
     address: 'New York No. 1 Lake Park',
-    index: 0,
   },
   {
     key: 'key2',
     name: 'Jim Green',
     age: 42,
     address: 'London No. 1 Lake Park',
-    index: 1,
   },
   {
     key: 'key3',
     name: 'Joe Black',
     age: 32,
     address: 'Sidney No. 1 Lake Park',
-    index: 2,
   },
 ];
 const wait = async (delay = 1000) =>
@@ -90,17 +87,29 @@ export default () => {
   const actionRef = useRef<ActionType>();
   const [dataSource1, setDatasource1] = useState(data);
   const [dataSource2, setDatasource2] = useState(data);
-  const handleDragSortEnd1 = (newDataSource: any) => {
+  const handleDragSortEnd1 = (
+    beforeIndex: number,
+    afterIndex: number,
+    newDataSource: any,
+  ) => {
     console.log('排序后的数据', newDataSource);
     setDatasource1(newDataSource);
     message.success('修改列表排序成功');
   };
-  const handleDragSortEnd2 = (newDataSource: any) => {
+  const handleDragSortEnd2 = (
+    beforeIndex: number,
+    afterIndex: number,
+    newDataSource: any,
+  ) => {
     console.log('排序后的数据', newDataSource);
     setDatasource2(newDataSource);
     message.success('修改列表排序成功');
   };
-  const handleDragSortEnd3 = (newDataSource: any) => {
+  const handleDragSortEnd3 = (
+    beforeIndex: number,
+    afterIndex: number,
+    newDataSource: any,
+  ) => {
     console.log('排序后的数据', newDataSource);
     // 模拟将排序后数据发送到服务器的场景
     remoteData = newDataSource;
@@ -122,6 +131,7 @@ export default () => {
         headerTitle="拖拽排序(默认把手)"
         columns={columns}
         rowKey="key"
+        search={false}
         pagination={false}
         dataSource={dataSource1}
         dragSortKey="sort"
@@ -130,7 +140,7 @@ export default () => {
       <DragSortTable
         headerTitle="拖拽排序(自定义把手)"
         columns={columns2}
-        rowKey="index"
+        rowKey="key"
         search={false}
         pagination={false}
         dataSource={dataSource2}
@@ -142,7 +152,7 @@ export default () => {
         actionRef={actionRef}
         headerTitle="使用 request 获取数据源"
         columns={columns2}
-        rowKey="index"
+        rowKey="key"
         search={false}
         pagination={false}
         request={request}

diff --git a/packages/table/src/components/DragSortTable/demos/drag.tsx b/packages/table/src/components/DragSortTable/demos/drag.tsx
@@ -31,21 +31,18 @@ const data = [
     name: 'John Brown',
     age: 32,
     address: 'New York No. 1 Lake Park',
-    index: 0,
   },
   {
     key: '2',
     name: 'Jim Green',
     age: 42,
     address: 'London No. 1 Lake Park',
-    index: 1,
   },
   {
     key: '3',
     name: 'Joe Black',
     age: 32,
     address: 'Sidney No. 1 Lake Park',
-    index: 2,
   },
 ];
 
@@ -67,6 +64,7 @@ export default () => {
       headerTitle="拖拽排序(默认把手)"
       columns={columns}
       rowKey="key"
+      search={false}
       pagination={false}
       dataSource={dataSource}
       dragSortKey="sort"