【React工作记录九十】ant design table实现上下行拖拽功能(类组件)

前言

最好的种树是十年前,其次是现在。歌谣 每天一个前端小知识 提醒你改好好学习了 知乎博主 csdn博主 b站博主 放弃很容易但是坚持一定很酷 我是歌谣 喜欢就一键三连咯 你得点赞是对歌谣最大的鼓励 微信公众号关注前端小歌谣

起始

首先刚开始知道要书写一个这样的功能我的内心是比较崩溃的 完全没有思路
然后就打开官网的文档进行观看

开始

一开始准备写 打开官网的一个文档是4.0的 看起来也是一脸的蒙蔽
接着找到3的一个文档

代码部分

import { Table } from 'antd';
import { DndProvider, DragSource, DropTarget } from 'react-dnd';
import { HTML5Backend } from 'react-dnd-html5-backend';
import update from 'immutability-helper';
 
let dragingIndex = -1;
 
class BodyRow extends React.Component {
  render() {
    const { isOver, connectDragSource, connectDropTarget, moveRow, ...restProps } = this.props;
    const style = { ...restProps.style, cursor: 'move' };
 
    let { className } = restProps;
    if (isOver) {