diff --git a/packages/components/table/hooks/useDragSort.ts b/packages/components/table/hooks/useDragSort.ts index 3a234a0407..69709e68e4 100644 --- a/packages/components/table/hooks/useDragSort.ts +++ b/packages/components/table/hooks/useDragSort.ts @@ -1,16 +1,17 @@ -// 表格 行拖拽 + 列拖拽功能 -import { MutableRefObject, useEffect, useMemo, useRef, useState } from 'react'; -import Sortable, { SortableEvent, SortableOptions, MoveEvent } from 'sortablejs'; +import { useEffect, useMemo, useRef, useState } from 'react'; import { get } from 'lodash-es'; +import Sortable, { type MoveEvent, type SortableEvent, type SortableOptions } from 'sortablejs'; + import log from '@tdesign/common-js/log/index'; -import swapDragArrayElement from '@tdesign/common-js/utils/swapDragArrayElement'; import { getColumnDataByKey, getColumnIndexByKey } from '@tdesign/common-js/table/utils'; -import { PaginationProps } from '../../pagination'; -import { TableRowData, TdPrimaryTableProps, DragSortContext } from '../type'; -import useClassName from './useClassName'; +import swapDragArrayElement from '@tdesign/common-js/utils/swapDragArrayElement'; import { hasClass } from '../../_util/style'; import useLatest from '../../hooks/useLatest'; -import { BaseTableColumns } from '../interface'; +import useClassName from './useClassName'; + +import type { PaginationProps } from '../../pagination'; +import type { BaseTableColumns, PrimaryTableRef } from '../interface'; +import type { DragSortContext, TableRowData, TdPrimaryTableProps } from '../type'; export default function useDragSort( props: TdPrimaryTableProps, @@ -18,8 +19,8 @@ export default function useDragSort( primaryTableRef, innerPagination, }: { - primaryTableRef: MutableRefObject; - innerPagination: MutableRefObject; + primaryTableRef: React.MutableRefObject; + innerPagination: React.MutableRefObject; }, ) { const { sortOnRowDraggable, dragSort, data, onDragSort } = props; @@ -208,16 +209,14 @@ export default function useDragSort( // 注册拖拽事件 useEffect(() => { - if (!primaryTableRef || !primaryTableRef.current) return; - registerRowDragEvent(primaryTableRef.current?.tableElement); - registerColDragEvent(primaryTableRef.current?.tableHtmlElement); + if (!primaryTableRef?.current) return; + registerRowDragEvent(primaryTableRef.current.tableElement); + registerColDragEvent(primaryTableRef.current.tableHtmlElement); /** 待表头节点准备完成后 */ const timer = setTimeout(() => { - if (primaryTableRef.current?.affixHeaderElement) { - registerColDragEvent(primaryTableRef.current.affixHeaderElement); - } + registerColDragEvent(primaryTableRef.current.affixHeaderElement); clearTimeout(timer); - }); + }, 50); return () => { clearTimeout(timer); };