diff --git a/zhouyiyuan.html b/zhouyiyuan.html new file mode 100644 index 0000000000000000000000000000000000000000..aa2c2a5e18738db083dbdff1f472611c754660e8 --- /dev/null +++ b/zhouyiyuan.html @@ -0,0 +1,98 @@ + + + + + + + 轮播图 + + + + +
+ +

对人类来说会不会太超前了？

+ +
+ + + + \ No newline at end of file diff --git a/zhouyiyuan.js b/zhouyiyuan.js new file mode 100644 index 0000000000000000000000000000000000000000..06278820f4190421ce38e3a9ceb34a411342f735 --- /dev/null +++ b/zhouyiyuan.js @@ -0,0 +1,198 @@ +const cityData = [ + { + parentValue: 1, + value: 11, + label: '北京市', + }, + { + parentValue: 11, + value: 111, + label: '东城区' + }, + { + parentValue: 11, + value: 112, + label: '西城区' + }, + { + parentValue: 1, + value: 12, + label: '上海市', + }, + { + parentValue: 12, + value: 121, + label: '黄浦区' + }, + { + parentValue: 12, + value: 122, + label: '徐汇区' + }, + { + parentValue: 1, + value: 13, + label: '广东省', + }, + { + parentValue: 13, + value: 131, + label: '广州市', + }, + { + parentValue: 131, + value: 1311, + label: '天河区' + }, + { + parentValue: 131, + value: 1312, + label: '越秀区' + }, + { + parentValue: 132, + value: 1321, + label: '南山区' + }, + { + parentValue: 132, + value: 1322, + label: '罗湖区' + }, + { + value: 1, + label: '中国', + }, + { + parentValue: 13, + value: 132, + label: '深圳市', + } +] + +/* * +1.请利用递归方法实现一个函数，把上方数据递归成有层级的数据， +2.把value字段变成id字段，label字段变成title字段，children字段变成child字段， +3.去掉parentValue字段，最终得到以下数据。需要一模一样的数据 +⚠️注意：不允许使用三层循环，请使用递归方法 +[ + { + id: 1, + title: '中国', + child: [ + { + id: 11, + title: '北京市', + child: [ + { + id: 111, + title: '东城区' + }, + { + id: 112, + title: '西城区' + } + ] + }, + { + id: 12, + title: '上海市', + child: [ + { + id: 121, + title: '黄浦区' + }, + { + id: 122, + title: '徐汇区' + } + ] + }, + { + id: 13, + title: '广东省', + child: [ + { + id: 131, + title: '广州市', + child: [ + { + id: 1311, + title: '天河区' + }, + { + id: 1312, + title: '越秀区' + } + ] + }, + { + id: 132, + title: '深圳市', + child: [ + { + id: 1321, + title: '南山区' + }, + { + id: 1322, + title: '罗湖区' + } + ] + } + ] + } + ] + } +] +* */ + + +const getArea = (data) => { + const nodeMap = {}; + data.forEach(item => { + nodeMap[item.value] = { + id: item.value, + title: item.label, + parentValue: item.parentValue + }; + }); + console.log(nodeMap) + + const buildTree = (parentId) => { + const children = Object.values(nodeMap) + .filter(node => node.parentValue === parentId) + .map(node => { + const newNode = { + id: node.id, + title: node.title + }; + const childNodes = buildTree(node.id); + if (childNodes.length > 0) { + newNode.child = childNodes; + } + delete nodeMap[node.id]; + return newNode; + }); + + return children; + }; + + + const rootNodes = Object.values(nodeMap) + .filter(node => node.parentValue === undefined); + + result.length = 0; + rootNodes.forEach(root => { + const tree = { + id: root.id, + title: root.title, + child: buildTree(root.id) + }; + result.push(tree); + delete nodeMap[root.id]; + }); +}; +const result = []; +getArea(cityData); +console.log(result);