antd 的Tree组件，是否支持拖拽限制

Question

在Tree组件拖拽的时候，想限制父节点不能拖拽到子节点这一层，意思是限制只能子节点往上拽。这个可以antd支持吗？

Answer 1

最终的渲染只在于数据是怎么样的，在数据的改变在于你自己的控制啊，允许不允许，不过是数据是否改变而已了。
比如下面的代码， 子节点 只能放到 第三个 下面，不能放到 第一个 下面（因为我的逻辑就是这样的）。
import * as React from 'react';
import {BaseComponent} from '../base';
import Tree from 'antd/lib/tree';
const TreeNode = Tree.TreeNode;
import 'antd/lib/tree/style/index.css';

export interface HeaderProps { }
export interface HeaderState { data: any }

export class Header extends BaseComponent<HeaderProps, HeaderState> {
state = {
data: [
{name: '第一个', key: 'a'},
{name: '第二个', key: 'b',
children: [
{name: '子节点', key: 'd'}
]},
{name: '第三个', key: 'c'}
]
};

constructor(props:HeaderProps) {
super(props);
}

onDragEnter(opt){
console.log(opt, 'x');
}

onDrop(opt){
const fromNode = opt.dragNode.props.eventKey;
const toNode = opt.node.props.eventKey;
if(toNode !== 'c'){ return }
this.state.data[2]['children'] = this.state.data[1]['children'];
this.state.data[1]['children'] = [];
this.setState({});
}

loop(data){
return data.map( d => {
if(d.children && d.children.length){
return <TreeNode key={d.key} title={d.name}>{this.loop(d.children)}</TreeNode>
} else {
return <TreeNode key={d.key} title={d.name}></TreeNode>
}
})
}

render() {
return (<div>
<Tree className="draggable-tree"
draggable
onDragEnter={this.onDragEnter.bind(this)}
onDrop={this.onDrop.bind(this)}>
{this.loop(this.state.data)}
</Tree>
</div>)
}
}