mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-12-04 00:49:39 +08:00
Code Issues Actions 9 Packages Projects Releases Wiki Activity

demo: fix the table moves when dragging elements to the right (#42745)

Browse Source 
* demo: fix the layout/table moves when dragging elements to the right

* fix: package json
This commit is contained in:
linxianxi 2023-05-31 13:36:20 +08:00 committed by GitHub
parent 695943dcd6
commit 88b2b54232
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/table/demo/drag-sorting-handler.tsx
View File

@ -1,6 +1,7 @@
import { MenuOutlined } from '@ant-design/icons';
import type { DragEndEvent } from '@dnd-kit/core';
import { DndContext } from '@dnd-kit/core';
import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
import {
arrayMove,
SortableContext,
@ -56,10 +57,7 @@ const Row = ({ children, ...props }: RowProps) => {
const style: React.CSSProperties = {
...props.style,
transform: CSS.Transform.toString(transform && { ...transform, scaleY: 1 })?.replace(
/translate3d\(([^,]+),/,
'translate3d(0,',
),
transform: CSS.Transform.toString(transform && { ...transform, scaleY: 1 }),
transition,
...(isDragging ? { position: 'relative', zIndex: 9999 } : {}),
};
@ -118,7 +116,7 @@ const App: React.FC = () => {
};
return (
<DndContext onDragEnd={onDragEnd}>
<DndContext modifiers={[restrictToVerticalAxis]} onDragEnd={onDragEnd}>
<SortableContext
// rowKey array
items={dataSource.map((i) => i.key)}

3
components/table/demo/drag-sorting.tsx
View File

@ -1,5 +1,6 @@
import type { DragEndEvent } from '@dnd-kit/core';
import { DndContext } from '@dnd-kit/core';
import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
import {
arrayMove,
SortableContext,
@ -87,7 +88,7 @@ const App: React.FC = () => {
};
return (
<DndContext onDragEnd={onDragEnd}>
<DndContext modifiers={[restrictToVerticalAxis]} onDragEnd={onDragEnd}>
<SortableContext
// rowKey array
items={dataSource.map((i) => i.key)}

1
package.json
View File

@ -163,6 +163,7 @@
"@argos-ci/core": "^0.8.0",
"@babel/eslint-plugin": "^7.19.1",
"@dnd-kit/core": "^6.0.7",
"@dnd-kit/modifiers": "^6.0.1",
"@dnd-kit/sortable": "^7.0.2",
"@dnd-kit/utilities": "^3.2.1",
"@emotion/babel-preset-css-prop": "^11.10.0",