O back-end retorna a estrutura de lista e o front-end atravessa os dados da árvore montados no elemento

Dados retornados em segundo plano: bean ou mapa personalizado podem ser usados

{   "msg": "操作 成功",   "result": [     {       "drop": false,       "clickHandler": false,       "gislefturl": "",       "icon": ""       ,       "existed ": false, "routeName ":" ",       " gis ": falso,       " verificado ": falso,       " clickExpand ": falso,       " arrastar ": falso,       " id ":" 37060700 ",       " texto ":" ",       " nocheck ": falso,       "chkDisabled": false,       "iconOpen": "",       "isParent": false,       "manager": "",       "index": "",       "oldParentId": "",       "click": "",       "iconClose": "",
























      "parentId": "37060000",
      "url": "",
      "target": "",
      "if_check": "0",
      "phone": "",
      "name": "牟平", "infoMap
      ": { },
      "menuType": "",
      "open": false,
      "desc": ""
    },
    {       "drop": false,       "clickHandler": false,       "gislefturl": "",       "icon": "",       "       existed": false, "routeName": "",       "gis": falso,       "verificado": falso,       "clickExpand": falso,       "arrastar": falso,       "id": "37060701",       "texto": "",       "nocheck": falso,













      "chkDisabled": false,
      "iconOpen": "",
      "isParent": false,
      "manager": "",
      "index": "",
      "oldParentId": "",
      "click": "",
      "iconClose" : "",
      "parentId": "37060700",
      "url": "",
      "target": "",
      "if_check": "0",
      "phone": "",
      "name": "办公室",
      " infoMap ": {},
      " menuType ":" ",
      " abrir ":false,
      "desc": ""
    },
    {       "drop": false,       "clickHandler": false,       "gislefturl": "",       "icon": "",       "existed": false,





      "routeName": "",
      "gis": false,
      "
      CHECK ": false, "clickExpand": false,
      "drag": false,
      "id": "37060702",
      "text": "",
      "nocheck": false,
      "chkDisabled": false,
      "iconOpen": "",
      "isParent": false,
      "manager": "",
      "index": "",
      "oldParentId": "",
      "click": "",
      " iconClose ":" ",
      " parentId ":" 37060700 ",
      "url": "",
      "target": "",
      "if_check": "0",
      "phone": "",
      "name": "工程 管理 科",
      "infoMap": {},
      "menuType": "",
      "open": false,
      "desc": ""
    },
    {       "drop": false,       "clickHandler": false,       "gislefturl": "",       "icon": ""       ,       "existed" : false, "routeName" : "",       "gis": falso,       "verificado": falso,       "clickExpand": falso,       "arrastar": falso,       "id": "37060703",       "texto": "",       "nocheck": falso,       " chkDisabled ": false,       " iconOpen ":" ",       "isParent": false,       "manager": "",       "index": "",       "oldParentId": "",       "click": "",       "iconClose": "",





















      "parentId": "37060700",
      "url": "",
      "target": "",
      "if_check": "0",
      "phone": "",
      "name": "计划 财务科", "infoMap
      " : {},
      "menuType": "",
      "open": false,
      "desc": ""
    },
 
  ],
  "code": 0
}

 

Método de atendimento da recepção:

flap2tree (arr, key = 'id', parentKey = 'pid', rootFilter) {

deixe rs = [];

deixe mapObj = {};

let copyArr = [];

arr.forEach ((item) => {

deixe newItem = {... item};

copyArr.push (newItem);

mapObj [item [chave]] = newItem;

});

copyArr.forEach ((item) => {

let pid = item [parentKey];

let parent = null;

if (pid) {

pai = mapObj [pid];

if (pai) {

if (! parent.children) {

parent.children = [];

}

parent.children.push (item);

}

}

if (! pai) {

rs.push (item);

}

mapObj [item [tecla]] = item;

});

if (rootFilter) {

rs = rs.filter (rootFilter);

}

return rs;

}

Acho que você gosta

Origin blog.csdn.net/CarryBest/article/details/94629686
Recomendado
Clasificación