el-cascader obtains all corresponding parent node ids based on the id of the known data child node. From left to right, it is the first-level id, the second-level id, and the third-level id.
method one
let opDatas = this.getData(this.options); // It is the processed tree data //TODO: To test the tree ->[the first id of each item] and the last name let status = false; const func = (arr) => { arr.forEach((item, index) => { if (item.children & amp; & amp; item.children.length > 0) { if (index == 0) { idsArr.push(item.id); } func(item.children); } else { if (index == 0 & amp; & amp; !status) { idsArr.push(item.id); status = true; } if (name == "") { name = item.name; } } }); }; func(opDatas); this.parentIds = idsArr; //The output is [ancestor id, parent id, id] this.tableTitle = name; // Corresponding name
Method Two
const response = { code: 200, msg: null, data: [ { id: "0", parentId: "-1", name: "urban", fullPath: "-1,0,", scope: null, scopeAll: null, nightMin: null, treeLevel: 1, formula: null, trade: null, flowNum: 1, children: [ { id: "10", parentId: "0", name: "Zhouzhuang", fullPath: "0,10", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, { id: "1", parentId: "0", name: "Development Zone", fullPath: "0,1,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, children: [ { id: "1701053903855128577", parentId: "1", name: "Add test", fullPath: "0,1,1701053903855128577,", scope: "120.962906,31.41166 120.962391,31.411367 120.965138,31.372682 121.020466,31.40438 121.001068,31.417419 120.979267,31.4210 81 ", scopeAll: "[[120.962906,31.41166],[120.962391,31.411367],[120.965138,31.372682],[121.020466,31.40438],[121.001068,31.417419],[120.97 9267,31.421081]]", nightMin: "12.36", treeLevel: 3, formula: "", trade: "", flowNum: 3, }, ], }, { id: "2", parentId: "0", name: "花青", fullPath: "0,2,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, { id: "3", parentId: "0", name: "bacheng", fullPath: "0,3,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, { id: "4", parentId: "0", name: "weekly market", fullPath: "0,4,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, { id: "5", parentId: "0", name: "Zhang Pu", fullPath: "0,5,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, { id: "6", parentId: "0", name: "Qiandeng", fullPath: "0,6,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, { id: "7", parentId: "0", name: "Lu family", fullPath: "0,7,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, { id: "8", parentId: "0", name: "Jinxi", fullPath: "0,8,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, { id: "9", parentId: "0", name: "Dianshan Lake", fullPath: "0,9,", scope: null, scopeAll: null, nightMin: null, treeLevel: 2, formula: null, trade: null, flowNum: null, }, ], }, ], }; export function helperCreateTreeFunc(handle) { return function (obj, iterate, options?, context?) { let opts = options || {}; let optChildren = opts.children || "children"; return handle(null, obj, iterate, context, [], [], optChildren, opts, null); }; } function findTreeItem( parent, obj, iterate, context, path, node, parseChildren, opts ) { if (obj) { let item, index, len, paths, nodes, match; for (index = 0, len = obj.length; index < len; index + + ) { item = obj[index]; paths = path.concat(["" + index]); nodes = node.concat([item]); if (iterate.call(context, item, index, obj, paths, parent, nodes)) { return { index: index, item: item, path: paths, items: obj, parent: parent, nodes: nodes, }; } if (parseChildren & amp; & amp; item) { match = findTreeItem( item, item[parseChildren], iterate, context, paths.concat([parseChildren]), nodes, parseChildren, opts ); if (match) { return match; } } } } } export const findTree = helperCreateTreeFunc(findTreeItem); const data = response.data; const getNodePathIds = (id, idList = []) => { const resultItem = findTree(data, (item) => item.id === id); if (!resultItem) return idList; const target = resultItem.item; idList.unshift(target.id); if (target.parentId) { return getNodePathIds(target.parentId, idList); } return idList; }; const ids = getNodePathIds("1701053903855128577"); console.log(ids, "--ids");