在此声明一下嗷兄弟闷儿!我没写样式纯粹是console.log()打印控制面板的!
全局声明一个data;
let data;'
然后去获取到json的假数据
let xhr = new XMLHttpRequest(); // 设置请求方式和请求地址 xhr.open('get', './js/menu.json', true); // 发送请求 xhr.send(); // 接收返回的响应数据 xhr.onreadystatechange = function () { if (xhr.readyState == 4 && xhr.status == 200) { data = JSON.parse(xhr.responseText); // 调用展示商品的函数 console.log(data); fun(data); } };
然后function一个变量进行调用!加上下面的自己去看吧,家人们
function fun(data) { let arr = []; for (let i in data) { if (data[i].pid == 0) { data[i].children = []; // 初始化 children 数组 for (let j in data) { if (data[j].pid == data[i].id) { // 找到当前节点的子节点 data[i].children.push(data[j]); // 将子节点添加到 children 数组中 } data[j].childrens = []; for (let k in data) { if (data[k].pid == data[j].id) { data[j].childrens.push(data[k]); } } } arr.push(data[i]); // 将构建好的根节点添加到 arr 中 } } console.log(arr); }