antd tree拖拽时,有些节点只能放在指定类型下或插入到数据中等需求,需要根据dropPosition、dropToGap插入到对应位置,这两个含义说明如下:
onDrop = info => {
// info.node: drop时放置位置相关的节点,可能是drop位置的上个元素(同级或上级)、最顶层时是下个元素
const dropKey = info.node.props.key;
// info.dragNode:拖拽的节点
const dragKey = info.dragNode.props.key;
const dropPos = info.node.pos.split('-');
const dropPosition = info.dropPosition - Number(dropPos[dropPos.length - 1]);
/**
* dropPosition说明:
* -1:移动到和dropKey的平级,并在其上面(即info.dropPosition比dropKey的下标小一个)
* 1:移动到和dropKey的平级,并在其下面(info.dropPosition比dropKey的下标大一个)
* 0:是移动到dropKey下面作为他的子级(info.dropPosition和dropKey的下标同样大
*/
// info.dropToGap:最外一层的第一个是true,移动到其他树枝的第一个时是false,移动到不是第一个的位置是true
}
注意:antd不同版本时,info对应node和dragNode结构差异,上面是antd3.X