React+Antd通过Tree组件实现可编辑可拖拽节点树

import React, { useState, useEffect } from 'react';
import { Tree } from 'antd';
import {
  PlusOutlined,
  EditOutlined,
  MinusOutlined,
  CheckOutlined,
  DeleteOutlined,
} from '@ant-design/icons';
import styles from './index.less';
const { TreeNode } = Tree;

const DragTable = () => {
  let data = [
    {
      value: '董事会',
      defaultValue: '董事会',
      key: '0-1',
      parentKey: '0',
      isEditable: false,
      children: [
        {
          value: '小白龙',
          defaultValue: '小白龙',
          key: '0-1-1',
          parentKey: '1-1',
          isEditable: false,
          children: [
            {
              value: '小红',
              defaultValue: '小红',
              key: '0-1-11',
              parentKey: '1-11',
              isEditable: false,
            },
            {
              value: '小绿',
              defaultValue: '小绿',
              key: '0-1-12',
              parentKey: '1-12',
              isEditable: false,
            },
            {
              value: '小青',
              defaultValue: '小青',
              key: '0-1-13',
              parentKey: '1-13',
              isEditable: false,
            },
          ],
        },
      ],
    },
    {
      value: '财务部',
      defaultValue: '财务部',
      key: '0-2',
      parentKey: '1',
      isEditable: false,
      children: [
        {
          value: '小红',
          defaultValue: '小红',
          key: '0-2-1',
          parentKey: '2-1',
          isEditable: false,
        },
        {
          value: '小绿',
          defaultValue: '小绿',
          key: '0-2-2',
          parentKey: '2-2',
          isEditable: false,
        },
        {
          value: '小青',