O.o
【树数据】根据id获取所有父亲的name值或者记录集合
有不错的方案务必告诉我。
业务逻辑不会写啊,烦。努力 百度百度~谷歌谷歌。
一二事
写得不怎么规范,啥搞得。没啥状态了,想不出了。勉强可以应付业务逻辑。
之前就单纯得该节点的所有父亲的name值,loopDepName函数
中的猴子补丁临时添加不需要删去即可,也没啥思路去想如何格式化一代码了。
示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script> /** 我的后端返回测试数据:是这样的,扁平化数组集合,没有整合处理的。需要手动处理成 `树数据` * 关联识别依据: * id 与 pid 的联系,每条记录都有自己唯一id标识,记录中还有应该 pid 字段是来寻找它的所属或者它上级父亲(pid 对应着它的上级的 id) * children 字段,来存储自身的下属节点。 * * 即:{ id: 180, name: "一楼", pid: 179 } 这条数据,它的上级是 { id: 179, name: "2020级", pid: 0 } 的 * 如果找不到说明它自身就是一个顶级节点。后端它也给了一个字段来标识就是 pid 为 0时,说明它是顶级节点(这个字段我也不需要用不到) */ var json = {
code: 200, data: [{
"create_time": 1617698609000, "is_open": null, "pid": 0, "priority": 0, "type": 0, "update_time": 1622692018000, "deleted": 0, "name": "2020级", "id": 179, "status": 1 }, {
"create_time": 1617698623000, "is_open": null, "pid": 179, "priority": 0, "type": 0, "update_time": 1617698631000, "deleted": 0, "name": "一楼", "id": 180, "status": 1, "disabled": true }, {
"create_time": 1617698664000, "is_open": null, "pid": 180, "priority": 0, "type": 2, "update_time": 1625997267000, "deleted": 0, "name": "1楼会议室", "id": 181, "status": 1, "disabled": true }, {
"create_time": 1617698677000, "is_open": null, "pid": 180, "priority": 0, "type": 2, "update_time": 1625997275000, "deleted": 0, "name": "快捷教室", "id": 182, "status": 1 }, {
"create_time": 1621677691000, "is_open": null, "pid": 180, "priority": 0, "type": 0, "update_time": 1621677691000, "deleted": 0, "name": "大厅", "id": 194, "status": 1 }, {
"create_time": 1625969947000, "is_open": null, "pid": 0, "priority": 0, "type": 0, "update_time": 1625969947000, "deleted": 0, "name": "2021级", "id": 199, "status": 1 }, {
"create_time": 1625969958000, "is_open": null, "pid": 199, "priority": 0, "type": 2, "update_time": 1625997474000, "deleted": 0, "name": "北京代号", "id": 200, "status": 1 }, {
"create_time": 1625970184000, "is_open": null, "pid": 199, "priority": 0, "type": 2, "update_time": 1625976170000, "deleted": 0, "name": "广州代号", "id": 201, "status": 1 }, {
"create_time": 1625975739000, "is_open": null, "pid": 199, "priority": 0, "type": 2, "update_time": 1625975739000, "deleted": 0, "name": "河南代号", "id": 202, "status": 1 }, {
"create_time": 1625975755000, "is_open": null, "pid": 199, "priority": 0, "type": 2, "update_time": 1625975755000, "deleted": 0, "name": "河北代号", "id": 203, "status": 1 }, {
"create_time": 1617698623000, "is_open": null, "pid": 179, "priority": 0, "type": 0, "update_time": 1617698631000, "deleted": 0, "name": "二楼", "id": 900, "status": 1, "disabled": true }, {
"create_time": 1617698664000, "is_open": null, "pid": 900, "priority": 0, "type": 2, "update_time": 1625997267000, "deleted": 0, "name": "2楼201", "id": 901, "status": 1, "disabled": true }, {
"create_time": 1617698664000, "is_open": null, "pid": 900, "priority": 0, "type": 2, "update_time": 1625997267000, "deleted": 0, "name": "2楼202", "id": 902, "status": 1, "disabled": true } ], msg: "成功" } function treeDataHandler(resource) {
// 整合处理tree数据,resourse 资源,对其处理的数据 var data = resource; var mapPlaceId = {
}; var zArr = []; var _this = this; data.forEach(function (item) {
var id = item.id; var pid = item.pid; var self = item; if (mapPlaceId.hasOwnProperty(pid)) {
mapPlaceId[pid].children = mapPlaceId[pid].children || []; mapPlaceId[pid].children.push(self); } else {
zArr.push(self); } mapPlaceId[id] = self; }); // console.log(zArr); return zArr; } var data = json.data; var placeData = treeDataHandler(data); console.log("%c整合处理后的树数据: ", "color: blue", placeData); // 函数之前就简单用来获取它以上的名称的,额外添加一些逻辑代码。存储了整个对象 // 想获取id,根据需求改动逻辑`item.name`就访问 id 即可 function loopDepName(treeData, id, joinStr, result) {
var str = ""; var joinStr = joinStr || ","; for (var i = 0; i < treeData.length; i++) {
var item = treeData[i]; // 是 if (item.id === id) {
// region # monkey patch - 猴子布丁 🍮 result.unshift(item); // endregion 🍮 return item.name; } if (item.children) {
str = item.name + joinStr + this.loopDepName(item.children, id, joinStr, result); // region # monkey patch - 猴子布丁 🍮 if (result.length !== 0) {
result.unshift(item); } // endregion 🍮 if (str === item.name + joinStr) {
str = "" } else {
return str; } } } return str; } // 接受存储记录集合 var result = [] var temp = loopDepName(placeData, 181, ",", result) console.log("%c根据id获取到符合预期的数据: ", "color: blue", temp, result); </script>
</body>
</html>
当别人问你80年代香港歌星有几个,希望你地能提下我。
今天的文章【树结构】根据节点ID,递归查找它以上的所有父节点分享到此就结束了,感谢您的阅读。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/63220.html