ant design拖拽手柄列拖動時樣式錯亂的解決方案

1、拖動時，其他行隱藏原因是Table中的rowKey屬性與判斷的屬性的不一樣

 <Table
          rowKey="id"   //不要用官網的index，用后台返的id名
          components={{
            body: {
              wrapper: DraggableContainer,
              row: DraggableBodyRow,
            },
          }}
          pagination={false}
          dataSource={dataSource}
          columns={columns}
          loading={loading}
        >

 </Table>

//官網
  DraggableBodyRow = ({ className, style, ...restProps }) => {
    const { dataSource } = this.state;
    // function findIndex base on Table rowKey props and should always be a right array index
    const index = dataSource.findIndex(x => x.index === restProps['data-row-key']);   //這里用的是index
    return <SortableItem index={index} {...restProps} />;
  };
//改動
 const DraggableBodyRow = ({ className, style, ...restProps }) => {
    // const { dataSource } = this.state;
    // function findIndex base on Table rowKey props and should always be a right array index
    const index = dataSource.findIndex(x => x.id === restProps['data-row-key']);   //將index改為Table中設置的id名
    return <SortableItem index={index} {...restProps} />;
  };

2、Table中有圖片時，樣式不居中

.row-dragging td {
  padding: 16px;
  visibility: hidden;
  vertical-align: middle;   //這個控制樣式居中，加上就可以了
}