vue数据转树状结构进阶（两级父节点）

已于 2023-09-18 20:23:15 修改
阅读量130 收藏
点赞数
文章标签： vue.js 前端 javascript
于 2023-09-18 20:01:40 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42192641/article/details/132994374
版权

需求：不仅按照项目还要按照教师名称

let dataX = [
    {
      "uuid": "04991AB0ED31413EE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "eab61e92f937437caf94f4928d21fb2d",
      "projName": "TEST0901_0928",
      "trainId": "0901_0928",
      "courseId": null,
      "courseName": "气象课1",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "be083f6f10bc4168b6d04106f14b5b68",
      "evalStatus": "0",
      "saveTime": "2023-09-05 16:19:38"
    },
    {
      "uuid": "04991AB0ED36413EE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "eab61e92f937437caf94f4928d21fb2d",
      "projName": "TEST0901_0928",
      "trainId": "0901_0928",
      "courseId": null,
      "courseName": "气象课1",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "65f9ced819a74c879c640082772383d6",
      "evalStatus": "0",
      "saveTime": "2023-09-05 16:19:38"
    },
    {
      "uuid": "04991AB0ED35413EE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "eab61e92f937437caf94f4928d21fb2d",
      "projName": "TEST0901_0928",
      "trainId": "0901_0928",
      "courseId": null,
      "courseName": "气象课1",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "23b7e94695ef49cc860ca32fd60d795d",
      "evalStatus": "0",
      "saveTime": "2023-09-05 16:19:38"
    },
    {
      "uuid": "04991AB0ED34413EE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "eab61e92f937437caf94f4928d21fb2d",
      "projName": "TEST0901_0928",
      "trainId": "0901_0928",
      "courseId": null,
      "courseName": "气象课1",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "81686d4bf5684f57a2a55b275527b02b",
      "evalStatus": "0",
      "saveTime": "2023-09-05 16:19:38"
    },
    {
      "uuid": "04991AB0ED33413EE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "eab61e92f937437caf94f4928d21fb2d",
      "projName": "TEST0901_0928",
      "trainId": "0901_0928",
      "courseId": null,
      "courseName": "气象课1",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "d0a8c90d5e1746f6a6aa279136a3ee0d",
      "evalStatus": "0",
      "saveTime": "2023-09-05 16:19:38"
    },
    {
      "uuid": "04991AB0ED30413EE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "eab61e92f937437caf94f4928d21fb2d",
      "projName": "TEST0901_0928",
      "trainId": "0901_0928",
      "courseId": null,
      "courseName": null,
      "courseTime": "2023-09-01 08:30-09:15",
      "resourceId": null,
      "resourceName": null,
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 10.0,
      "preLessonRemark": null,
      "familiarity": 10.0,
      "familiarityRemark": null,
      "importance": 10.0,
      "importanceRemark": null,
      "theoryPractice": 3.0,
      "theoryPracticeRemark": null,
      "instruct": 20.0,
      "instructRemark": null,
      "useSample": 1.0,
      "useSampleRemark": null,
      "methods": 10.0,
      "methodsRemark": null,
      "classTime": 10.0,
      "classTimeRemark": null,
      "comEvaluation": 84.0,
      "evalRemark": "李宁哦哦",
      "evalId": "002E0518DD5074F2E065000000000001",
      "evalStatus": "1",
      "saveTime": "2023-09-05 16:19:38"
    },
    {
      "uuid": "04991AB0ED32413EE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "eab61e92f937437caf94f4928d21fb2d",
      "projName": "TEST0901_0928",
      "trainId": "0901_0928",
      "courseId": null,
      "courseName": "气象课1",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "403ab08d05f44c9d84e479fe0f1f0d8a",
      "evalStatus": "0",
      "saveTime": "2023-09-05 16:19:38"
    },
    {
      "uuid": "036A074BBF947EABE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "dcf44c6f3cde454fa50116aebff08b6e",
      "projName": "测试0821",
      "trainId": "px-2023-0821",
      "courseId": null,
      "courseName": null,
      "courseTime": "2023-08-21 08:30-16:15",
      "resourceId": "02ED47ECE717763CE065000000000001",
      "resourceName": "管训楼107",
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 10.0,
      "preLessonRemark": null,
      "familiarity": 10.0,
      "familiarityRemark": null,
      "importance": 10.0,
      "importanceRemark": null,
      "theoryPractice": 10.0,
      "theoryPracticeRemark": null,
      "instruct": 10.0,
      "instructRemark": null,
      "useSample": 10.0,
      "useSampleRemark": null,
      "methods": 10.0,
      "methodsRemark": null,
      "classTime": 1.0,
      "classTimeRemark": null,
      "comEvaluation": 81.0,
      "evalRemark": "sdsd",
      "evalId": "d54d97c1550c422ca0e163c132389ee5",
      "evalStatus": "1",
      "saveTime": "2023-08-21 14:35:23"
    },
    {
      "uuid": "036A074BBF927EABE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "dcf44c6f3cde454fa50116aebff08b6e",
      "projName": "测试0821",
      "trainId": "px-2023-0821",
      "courseId": null,
      "courseName": "气象课",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "F6D8BE2B9FCD6B8AE055000000000001",
      "evalStatus": "0",
      "saveTime": "2023-08-21 14:35:23"
    },
    {
      "uuid": "036A074BBF937EABE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "dcf44c6f3cde454fa50116aebff08b6e",
      "projName": "测试0821",
      "trainId": "px-2023-0821",
      "courseId": null,
      "courseName": "气象课",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "fec1d3cb91cc4dc89a38d4b2935a6e93",
      "evalStatus": "0",
      "saveTime": "2023-08-21 14:35:23"
    },
    {
      "uuid": "036A074BBF957EABE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "dcf44c6f3cde454fa50116aebff08b6e",
      "projName": "测试0821",
      "trainId": "px-2023-0821",
      "courseId": null,
      "courseName": "气象课",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "adb8d5b000164402b853d6f2f40b7b95",
      "evalStatus": "0",
      "saveTime": "2023-08-21 14:35:23"
    },
    {
      "uuid": "036A074BBF967EABE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "dcf44c6f3cde454fa50116aebff08b6e",
      "projName": "测试0821",
      "trainId": "px-2023-0821",
      "courseId": null,
      "courseName": "气象课",
      "courseTime": null,
      "resourceId": null,
      "resourceName": null,
      "sense": null,
      "senseRemark": null,
      "preLesson": null,
      "preLessonRemark": null,
      "familiarity": null,
      "familiarityRemark": null,
      "importance": null,
      "importanceRemark": null,
      "theoryPractice": null,
      "theoryPracticeRemark": null,
      "instruct": null,
      "instructRemark": null,
      "useSample": null,
      "useSampleRemark": null,
      "methods": null,
      "methodsRemark": null,
      "classTime": null,
      "classTimeRemark": null,
      "comEvaluation": null,
      "evalRemark": null,
      "evalId": "236690bf31504e9f85b3c442a843fa7d",
      "evalStatus": "0",
      "saveTime": "2023-08-21 14:35:23"
    },
    {
      "uuid": "028A0F7F209E546DE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "e90a05335e584824947cb8cd4ad461e0",
      "projName": "测试0809",
      "trainId": "0809",
      "courseId": null,
      "courseName": null,
      "courseTime": "2023-08-10 08:30-10:15",
      "resourceId": "F8A2B4EE72586516E055000000000001",
      "resourceName": "训练楼103",
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 10.0,
      "preLessonRemark": null,
      "familiarity": 10.0,
      "familiarityRemark": null,
      "importance": 10.0,
      "importanceRemark": null,
      "theoryPractice": 10.0,
      "theoryPracticeRemark": null,
      "instruct": 10.0,
      "instructRemark": null,
      "useSample": 10.0,
      "useSampleRemark": null,
      "methods": 0.0,
      "methodsRemark": null,
      "classTime": 10.0,
      "classTimeRemark": null,
      "comEvaluation": 80.0,
      "evalRemark": "fvdsgsdfg",
      "evalId": "002E0518DD5074F2E065000000000001",
      "evalStatus": "1",
      "saveTime": "2023-08-10 11:19:14"
    },
    {
      "uuid": "0176C00FA5180EE9E065000000000001",
      "teacherId": "f9dde5be35844417ac9cc6aabc0234d5",
      "teacherName": "陆虎",
      "planId": "a10aee22727848e8af8010f954df2241",
      "projName": "测试0710",
      "trainId": "Test-0710",
      "courseId": null,
      "courseName": null,
      "courseTime": "2023-03-21 08:30-16:15",
      "resourceId": null,
      "resourceName": null,
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 10.0,
      "preLessonRemark": null,
      "familiarity": 0.0,
      "familiarityRemark": null,
      "importance": 10.0,
      "importanceRemark": null,
      "theoryPractice": 0.0,
      "theoryPracticeRemark": null,
      "instruct": 10.0,
      "instructRemark": null,
      "useSample": 10.0,
      "useSampleRemark": null,
      "methods": 10.0,
      "methodsRemark": null,
      "classTime": 10.0,
      "classTimeRemark": null,
      "comEvaluation": 70.0,
      "evalRemark": "gdsg",
      "evalId": "002E0518DD5074F2E065000000000001",
      "evalStatus": "1",
      "saveTime": "2023-07-27 19:03:00"
    },
    {
      "uuid": "00692761019E04EAE065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "f590b85ba0a944e381514386298c4038",
      "projName": "2023第4期气象培训",
      "trainId": "PX-2023-04",
      "courseId": null,
      "courseName": "F82C91AFB3781D54E055000000000001",
      "courseTime": "2023-07-24 08:30-09:15",
      "resourceId": "F8A2B4EE72586516E055000000000001",
      "resourceName": "训练楼103",
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 10.0,
      "preLessonRemark": null,
      "familiarity": 10.0,
      "familiarityRemark": null,
      "importance": 10.0,
      "importanceRemark": null,
      "theoryPractice": 10.0,
      "theoryPracticeRemark": null,
      "instruct": 10.0,
      "instructRemark": null,
      "useSample": 10.0,
      "useSampleRemark": null,
      "methods": 10.0,
      "methodsRemark": null,
      "classTime": 10.0,
      "classTimeRemark": null,
      "comEvaluation": 90.0,
      "evalRemark": null,
      "evalId": "002E0518DD5074F2E065000000000001",
      "evalStatus": "1",
      "saveTime": "2023-07-14 09:13:17"
    },
    {
      "uuid": "005DCEF6927C1A65E065000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "db6a0ef66dcd4e57afa4af49f7a1081f",
      "projName": "2023第1期培训",
      "trainId": "PX-2023-01",
      "courseId": null,
      "courseName": "F82C91AFB3781D54E055000000000001",
      "courseTime": "2023-08-01 08:30-10:15",
      "resourceId": "F8A2B4EE72586516E055000000000001",
      "resourceName": "训练楼103",
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 10.0,
      "preLessonRemark": null,
      "familiarity": 10.0,
      "familiarityRemark": null,
      "importance": 10.0,
      "importanceRemark": null,
      "theoryPractice": 10.0,
      "theoryPracticeRemark": null,
      "instruct": 10.0,
      "instructRemark": null,
      "useSample": 10.0,
      "useSampleRemark": null,
      "methods": 10.0,
      "methodsRemark": null,
      "classTime": 10.0,
      "classTimeRemark": null,
      "comEvaluation": 90.0,
      "evalRemark": null,
      "evalId": "002E0518DD5074F2E065000000000001",
      "evalStatus": "1",
      "saveTime": "2023-07-13 19:41:09"
    },
    {
      "uuid": "FF43EE3BC4F05CC4E055000000000001",
      "teacherId": "f9dde5be35844417ac9cc6aabc0234d5",
      "teacherName": "陆虎",
      "planId": "4cf36ce4c8e542b0ae0d111ff2a85ae7",
      "projName": "测试0629",
      "trainId": "test-0629",
      "courseId": null,
      "courseName": "F842FE12AF2E317DE055000000000001",
      "courseTime": "2023-06-26 08:30-10:15",
      "resourceId": "F8A2B4EE72586516E055000000000001",
      "resourceName": "训练楼103",
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 8.0,
      "preLessonRemark": null,
      "familiarity": 8.0,
      "familiarityRemark": null,
      "importance": 9.0,
      "importanceRemark": null,
      "theoryPractice": 9.0,
      "theoryPracticeRemark": null,
      "instruct": 15.0,
      "instructRemark": null,
      "useSample": 9.0,
      "useSampleRemark": null,
      "methods": 8.0,
      "methodsRemark": null,
      "classTime": 10.0,
      "classTimeRemark": null,
      "comEvaluation": 86.0,
      "evalRemark": null,
      "evalId": "81686d4bf5684f57a2a55b275527b02b",
      "evalStatus": "1",
      "saveTime": "2023-06-29 20:09:48"
    },
    {
      "uuid": "FF43EE3BC4F15CC4E055000000000001",
      "teacherId": "f9dde5be35844417ac9cc6aabc0234d5",
      "teacherName": "陆虎",
      "planId": "4cf36ce4c8e542b0ae0d111ff2a85ae7",
      "projName": "测试0629",
      "trainId": "test-0629",
      "courseId": null,
      "courseName": "F842FE12AF2E317DE055000000000001",
      "courseTime": "2023-06-26 08:30-10:15",
      "resourceId": "F8A2B4EE72586516E055000000000001",
      "resourceName": "训练楼103",
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 9.0,
      "preLessonRemark": null,
      "familiarity": 8.0,
      "familiarityRemark": null,
      "importance": 7.0,
      "importanceRemark": null,
      "theoryPractice": 9.0,
      "theoryPracticeRemark": null,
      "instruct": 10.0,
      "instructRemark": null,
      "useSample": 10.0,
      "useSampleRemark": null,
      "methods": 10.0,
      "methodsRemark": null,
      "classTime": 10.0,
      "classTimeRemark": null,
      "comEvaluation": 83.0,
      "evalRemark": null,
      "evalId": "23b7e94695ef49cc860ca32fd60d795d",
      "evalStatus": "1",
      "saveTime": "2023-06-29 20:09:48"
    },
    {
      "uuid": "FF4469B721DA734AE055000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "4cf36ce4c8e542b0ae0d111ff2a85ae7",
      "projName": "测试0629",
      "trainId": "test-0629",
      "courseId": null,
      "courseName": "FD0CF1D6E5241FCEE055000000000001",
      "courseTime": "2023-06-27 08:30-09:15",
      "resourceId": "F8A2B4EE725A6516E055000000000001",
      "resourceName": "管训楼102",
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 9.0,
      "preLessonRemark": null,
      "familiarity": 8.0,
      "familiarityRemark": null,
      "importance": 8.0,
      "importanceRemark": null,
      "theoryPractice": 10.0,
      "theoryPracticeRemark": null,
      "instruct": 20.0,
      "instructRemark": null,
      "useSample": 10.0,
      "useSampleRemark": null,
      "methods": 10.0,
      "methodsRemark": null,
      "classTime": 9.0,
      "classTimeRemark": null,
      "comEvaluation": 94.0,
      "evalRemark": null,
      "evalId": "23b7e94695ef49cc860ca32fd60d795d",
      "evalStatus": "1",
      "saveTime": "2023-06-29 19:58:05"
    },
    {
      "uuid": "FF4469B721D9734AE055000000000001",
      "teacherId": "fd79ec5259364284875cb8e87a6cdda5",
      "teacherName": "王菲",
      "planId": "4cf36ce4c8e542b0ae0d111ff2a85ae7",
      "projName": "测试0629",
      "trainId": "test-0629",
      "courseId": null,
      "courseName": "FD0CF1D6E5241FCEE055000000000001",
      "courseTime": "2023-06-27 08:30-09:15",
      "resourceId": "F8A2B4EE725A6516E055000000000001",
      "resourceName": "管训楼102",
      "sense": 10.0,
      "senseRemark": null,
      "preLesson": 10.0,
      "preLessonRemark": null,
      "familiarity": 10.0,
      "familiarityRemark": null,
      "importance": 10.0,
      "importanceRemark": null,
      "theoryPractice": 10.0,
      "theoryPracticeRemark": null,
      "instruct": 10.0,
      "instructRemark": null,
      "useSample": 10.0,
      "useSampleRemark": null,
      "methods": 10.0,
      "methodsRemark": null,
      "classTime": 10.0,
      "classTimeRemark": null,
      "comEvaluation": 90.0,
      "evalRemark": null,
      "evalId": "81686d4bf5684f57a2a55b275527b02b",
      "evalStatus": "1",
      "saveTime": "2023-06-29 19:58:05"
    }
  ]
// 深拷贝
function deepClone(data) {
  let dataType = getDataType(data);
  let container;
  if (dataType === 'Object') {
    container = {};
  }
  if (dataType === 'Array') {
    container = [];
  }
  for (const key in data) {
    let type = getDataType(data[key]);
    if (key === 'Array' || type === 'Object') {
      container[key] = deepClone(data[key]);
    } else {
      container[key] = data[key];
    }
  }
  return container;
}
// 判断数据类型
function getDataType(data) {
  return Object.prototype.toString.call(data).slice(8, -1);
}
function addProAndTeach(data){
  // 添加一级父节点(project)
  var afterDeptList = []; // 找项目名
  var afterTeaData = []; // 将父节点添加进去
  for (let item of data) {
    if (!afterDeptList.includes(item.planId)) { // 如果这个项目id没有出现过，就把项目id第一个放进去
      afterDeptList.push(item.planId);
      let projName = item.projName + '(' + item.trainId + ')';
      // 添加一个该项目第一次出现的父节点
      afterTeaData.push({ uuid: item.planId, pid: '0', projName: projName, trainId: item.trainId, isParent: '1' });
      item.pid = item.planId;
    } else {
      item.pid = item.planId; //父节点出现了，给子节点添加一个索引
    }
  }
  data = [...afterTeaData, ...data];
  // 添加二级父节点(teacher)
  let result = [],
      teacherList = [];
  for (let item of data) {
    if (item.pid != '0') { // 如果pid不是0 那么说明有父节点
      let teacherId = item.teacherId;
      let planId = item.planId;
      let pid = planId + teacherId; // 项目名+teacher名
      if (teacherList.includes(pid)) {
        item.project = '';
        item.pid = planId + teacherId;
        item.projName = item.courseName;
        result.push(item);
      } else {
        teacherList.push(pid);
        result.push({ uuid: pid, pid: item.planId, projName: item.teacherName, isParent: '1' });

        //构造日期下的第一个节点
        let temp = deepClone(item);
        temp.pid = pid;
        temp.projName = temp.courseName;
        result.push(temp);
      }
    } else {
      result.push(item);
    }
  }
  return result
}

let y = addProAndTeach(dataX)

//自定义id,pid 转为树结构
function getDeptTreeCustom(data, pid, idField, pidField) {
  if (typeof idField == 'undefined') {
    idField = 'id';
  }
  if (typeof pidField == 'undefined') {
    pidField == 'pid';
  }
  const result = [];
  let temp;
  for (let i = 0; i < data.length; i++) {
    if (data[i][pidField] === pid) { // 如果元素的pid==0
      temp = getDeptTreeCustom(data, data[i][idField], idField, pidField);
      if (temp.length > 0) {
        data[i].children = temp;
      }
      result.push(data[i]);
    }
  }
  return result;
}
let all = getDeptTreeCustom(y,'0', 'uuid', 'pid')
console.log(all)

Rrar
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端vue将普通数组转换为父子级的树形结构数组
xiaotiaoza的博客
12-07 643
前端vue将普通数组转换为父子级的树形结构数组
vue 将平级数据处理成父子节点数据
weixin_45844542的博客
04-29 479
场景：在调接口的时候后端反的数据是平级的对象，为了展示符合设计图上的数据，需要将数据进行处理 export default { data() { return { PlatformConfirm: [], //改造好的数组 }, methods: { // 将数据改造成父子结构 // Platform.serviceOrderItem 接口的数据数组 Platform.serviceOrderItem.forEach((item) =>
vue动态生成多级树结构
weixin_45446654的博客
08-05 3692
vue 根据有多个子节点的数据动态生成树结构。
vue--vue+ElementUI实现动态树+数据表格+分页
鑫709的博客
05-11 2227
前提在上一篇博客之后，继续来写
vue+antDesign实现树形数据展示并表格父子级选中和取消联动；递归
Sunny_lxm的博客
10-24 5933
vue+antDesign实现树形数据展示并表格父子级选中和取消联动
vue自定义树状结构图的实现方法
01-18
vue 实现自定义树状结构图 可动态添加、删除 可整体拖拽 如需内容也为动态，把组件内容使用input、select等组件替换 数据结构 treeData: [{ name: '1', child: [ { name: '2', child: [{ name: '1' }, { ...
vue elementUI tree树形控件获取父节点ID的实例
10-18
今天小编就为大家分享一篇vue elementUI tree树形控件获取父节点ID的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue中如何让子组件修改父组件数据
08-27
Vue 中子组件修改父组件数据 Vue 中子组件修改父组件数据是指在 Vue 中，子组件如何修改父组件的数据。这种情况在开发中经常遇到，例如在表单提交时，子组件需要将数据传递给父组件进行处理。在 Vue 中，子组件...
Vue面试题（基础、进阶、高级）
03-21
props是父组件向子组件传递数据的方式，事件是子组件向父组件传递数据的方式，而$emit和$parent/$children则是组件之间通信的方式。 进阶 1. 什么是Vue的虚拟DOM？ Vue的虚拟DOM是一种轻量级的JavaScript对象，...
树状结构Demo（Vue-Ztree）--包含前后端.zip
09-01
基于Vue-Ztree-2.0实现树状结构的展示 启动步骤： 1.cmd至前端项目根目录执行“npm install”命令 2.“npm start”命令启动项目 后端项目：tree 基于springboot、mybaits-plus、mysql实现树状结构 启动步骤： 1.mvn...
vue tree树状结构 将普通数据转换为树状结构所需的数据类型
weixin_42598901的博客
07-09 2747
<template> <div> <el-tree ref="tree" node-key="objectId" :data="treeData" :props="props" :expand-on-click-node="false" de...
前端vue + element框架树形数据转换
qq_41356848的博客
11-20 1854
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Ma...
vue获取到树形结构后递归遍历数据，生成树形结构数据，无限级
weixin_41166682的博客
03-08 1万+
1.需求 做的是个三级联动的数据 options: [{ value: 1, label: '东南', children: [{ value: 2, label: '上海', children: [ { value: 3, label: '普陀' }, { value: 4, label: '黄埔' }, ...
项目中将普通数据转换成 el-tree 中的 tree结构
weixin_67254784的博客
08-05 325
项目中将普通数据转换成 el-tree 中的 tree结构
数据仓库为何分层，各层作用？
热门推荐
weixin_36190755的博客
09-29 1万+
优秀的分层设计能够让整个数据体系更易理解和使用 为什么要设计数据分层？ 数据有秩序地流转，数据的整个生命周期能够清晰明确被设计者和使用者感知。简单说就是使数仓整体看起来层次清晰、依赖关系直观。 因此，我们需要一套行之有效的数据组织和管理方法来让我们的数据体系更有序，这就是谈到的数据分层。数据分层并不能解决所有的数据问题，但是，数据分层却可以给我们带来如下的好处： 数据结构清晰：每一个数据分层都有它的作用域和职责，在使用表的时候能更方便地定位和理解 避免重复开发：规范数据分层，开发一些通用的中间层数
前端开发笔记：Vue将后端传来数据转换为树，并显示在el-tree上
Cdccc_daye的博客
07-13 1201
在页面加载时，从后端接收到一个复杂的树形结构，要从中提取出节点，创建新的树，符合el-tree的data属性格式，并显示出来。
vue+element实现树形上下拖拽，快速提升你的前端技能
Shids_的博客
08-23 4955
vue+element实现树形上下拖拽，快速提升你的前端技能
vue3——利用自定义指令实现下拉框分页懒加载
最新发布
zmy967131的博客
07-24 401
vue3——利用自定义指令实现下拉框分页懒加载
vue 数据转成树结构
04-24
首先需要明确数据的格式，例如以以下格式展示： ...在上述代码中，我们通过遍历数据，找到其父节点与子节点的关系，在递归调用 `buildTree` 方法时将子节点作为参数继续传递，直至找到所有子节点，最后得到树形结构。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值