React 封装tree实现节点删除,编辑功能?

#1

小弟目前需要写一个用ant design 框架封装一个tree 组件,选中条目时能够在旁边添加 编辑和 删除功能。 不知道该怎么下手,希望有写过的大神们,能够给小弟提供下方法思路或者代码,感谢感谢。

#2

还是自己改一个tree组件吧,这样想怎么改都好弄。想改第三方的有些困难吧。

#3

也想过,就是不知道该怎么封装。

#4
class tree extend Component{

  __buildTree(list){
    if(!list){
       return null;
    }
    return list.map((child,index)=>{
        const {title, childData} = child;
        return ( <div className="row" key={index}>
          <div className="title">{title}</div>
          <div className="child">
            {
               this.__buildTree(childData)
            }
          </div>
        </div> );
    });
  }  

  render(){
    const {childData} = this.state;
    return(
      <div className="treeCss">
        { this.__buildTree(childData)}
      </div>
    )  
  }
}

大致就这样,递归显示出子节点来,然后通过样式控件一下。
希望能帮到你。

#5

好的,谢谢啦。