antd TreeSelect 无限级选择

实现无限级多选功能

一、请求接口处理成以下数据（第二部）
let list = [];
for (let i = 0; i < data.retdata.length; i++) {
const item = data.retdata[i];
list.push({...item,parentcode:code})
}
yield put({type: 'getUserListData', getUserList: list, cod, id});
return;

二、数据
let aa = [
        {
            "code": "D1552729262LUO",
            "name": "华北",
            "type": "organization",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D1553484921BYD",
            "name": "华东",
            "type": "organization",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D15578187295J3",
            "name": "营销中心",
            "type": "organization",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D15583207542JI",
            "name": "福建区",
            "type": "organization",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D1568710637F3A",
            "name": "杭州区",
            "type": "organization",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D15693912258V6",
            "name": "华南",
            "type": "organization",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D1570687649YJW",
            "name": "广东区",
            "type": "organization",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D1532955512C_R",
            "name": "武汉",
            "type": "organization",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D1553485190IDX",
            "name": "开发部",
            "type": "depar",
            "parentcode": "D1552729262LUO",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D1553485199RP8",
            "name": "市场部",
            "parentcode": "D1552729262LUO",
            "type": "depar",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D1553485208PQN",
            "name": "技术部",
            "parentcode": "D1552729262LUO",
            "type": "depar",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "P1529575663PES",
            "name": "陶丽丽",
            "parentcode": "D1552729262LUO",
            "type": "oper",
            "clientcode": "Y0070",
            "imgurl": "http://clientimginfo.csjsoft.cn/Y0070/prtsysimg/eshoppic/df017b35-54b9-4a66-ab9d-0b73242f2729.jpeg"
        },
        {
            "code": "D1553485113GJU",
            "name": "武汉销售一部",
            "type": "depar",
            "parentcode": "D1532955512C_R",
            "clientcode": "Y0070",
            "imgurl": ""
        },
        {
            "code": "D1553485131LJW",
            "name": "武汉销售二部",
            "type": "depar",
            "parentcode": "D1532955512C_R",
            "clientcode": "Y0070",
            "imgurl": ""
        }
    ]

二、渲染
 1 <TreeSelect 
 2      onChange={treeChange}
 3      value={pagedata.addNewData.userList}
 4      treeCheckable={true}
 5      showCheckedStrategy={SHOW_PARENT}
 6      searchPlaceholder= '请选择可参投用户'
 7      style={{
 8          width: '24.7rem',
 9      }}
10 >
11          {pagedata.getUserList != [] && pagedata.getUserList != undefined ? aaa('') : []}
12                             
13  </TreeSelect>

三、处理数据
function aaa(id){
        if(!breakAction(id)){
            return;
        }
        let list = [];
        for (let i = 0; i < pagedata.getUserList.length; i++) {
            const item = pagedata.getUserList[i];  
            if(item.parentcode == id){
               list.push(<TreeNode key={item.code} value={item.code} 
               title={<div>{item.name}{item.type == 'oper' ? null
                : <Icon type="caret-down" style={{float: 'right'}} onClick={treeIconClick.bind(this, item.code, item.id)}/>}</div>}>
                {aaa(item.code)}
                </TreeNode>)
            }
        }
        return list;
    }

    function breakAction(id){
        let aaa = false;
        for (let i = 0; i < pagedata.getUserList.length; i++) {
            const item = pagedata.getUserList[i];
            if(item.parentcode == id){
                aaa = true;
            }
        }
        return aaa;
    }

原文地址：https://www.cnblogs.com/na-w/p/11813394.html