2018-06-28 tree 便利显示

image.png

//render tree.js

const paddingLeft={paddingLeft:10}
function renderChildren(data, datasource, props) {
    return Map(data, item => {
        return <div key={uuid()}>
            <RenderTreeTitle item={item} props={props}/>
            <div key={uuid()} className={"children"}  style={Merge(paddingLeft)}>
                {renderChildren(datasource[item.key], datasource, props)}
            </div>
        </div>
    })
}

//render tree title .js

<div style={Merge(displayFlex)}>
        {props.item.parent_id}==={props.item.title}
        <div>
            <Icon type="plus" style={Merge(paddingLeft10,)}
                  onClick={e => {
                      e.stopPropagation()
                      addNewTreeNode(props, item)
                  }}
            />
            <Icon type="minus-circle-o" style={Merge(paddingLeft10,)}/>
            <Icon type="edit" style={Merge(paddingLeft10,)}
                  onClick={e => {
                      e.stopPropagation()
                      props.setParentState({editItem: null})
                      props.setParentState({editItem: props.item})
                  }}
            />
        </div>
    </div>