1、拖动时,其他行隐藏原因是Table中的rowKey属性与判断的属性的不一样

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<Table
         rowKey="id"   //不要用官网的index,用后台返的id名
         components={{
           body: {
             wrapper: DraggableContainer,
             row: DraggableBodyRow,
           },
         }}
         pagination={false}
         dataSource={dataSource}
         columns={columns}
         loading={loading}
       >
 
</Table>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
//官网
  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中有图片时,样式不居中

1
2
3
4
5
.row-dragging td {
  padding: 16px;
  visibility: hidden;
  vertical-align: middle;   //这个控制样式居中,加上就可以了
}

  

 

 

posted on   随心的博客  阅读(1399)  评论(0编辑  收藏  举报
努力加载评论中...
点击右上角即可分享
微信分享提示