ant design tree 資料模式 和 獲取父節點
阿新 • • 發佈:2019-01-03
資料的結構:
const nodeList=[
{id:1,name:樹節點一",children:[{id:2,name:樹節點二",children:[{id:3,name:樹節點三"}]}]},
{id:4,name:樹節點四"},
{id:5,name:樹節點五",children:[{id:2,name:樹節點二"}]},
]
寫法:
<Tree defaultExpandAll checkable onCheck={this.onCheck}>
{this.setPermission(nodeList)
</Tree>
setPermission =nodeList=>{
const children=[];
nodeList.forEach(item=>{
if(!item.children){
children.push(<TreeNode title={item.name} key={item.id}/>)
}else{
children.push(
children.push(
<TreeNode title={item.name} key={item.id}>
{this.setPermission(item.children)}
</TreeNode>)
)
}
})
return children;
}
當要獲取父節點的時候
onCheck=(checkedKeys,info)=>{
//選中的節點 checkedKeys
//選中子節點的父節點 info.halfCheckedKeys
}