elementUI 树状图 点击子节点获取父节点

权限使用elementUI tree 组件,点击子节点获取对应多级的父节点

image.png

  这是应用的组件

                 <el-tree
                    :data="hovePermissData"
                    :default-checked-                                       keys='checkEditorData'
                    @check-change="treeNodeEditor"
                    :show-checkbox='true'
                    :indent="40"
                    default-expand-all
                    node-key="number"
                    ref="tree"
                    highlight-current
                    :props="defaultPropsEditor">
                 </el-tree>
  这是数据结构
  
  [
    {
        "name": "监控中心",
        "number": 1,
        "title": "monitor",
        "route": "",
        "source_type": "0",
        "status": "on",
        "sub_rule": [
            
        ],
        "switchStatus": true
    },
    {
        "name": "用户管理",
        "number": 2,
        "title": "passenger",
        "route": "",
        "source_type": "0",
        "status": "on",
        "sub_rule": [
            {
                "name": "用户列表",
                "number": 12,
                "title": "passenger_list",
                "route": "/v1/passenger/list",
                "source_type": "0",
                "status": "on",
                "sub_rule": [
                    {
                        "name": "编辑乘客信息",
                        "number": 36,
                        "title": "",
                        "route": "/v1/passenger/edit-passenger",
                        "source_type": "1",
                        "status": "on",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": true
                    }
                ],
                "switchStatus": true
            },
            {
                "name": "用户登录日志",
                "number": 13,
                "title": "passenger_login_log",
                "route": "/v1/passenger/login-log",
                "source_type": "0",
                "status": "on",
                "sub_rule": [
                    
                ],
                "switchStatus": true
            }
        ],
        "switchStatus": true
    },
    {
        "name": "司机管理",
        "number": 3,
        "title": "driver",
        "route": "",
        "source_type": "0",
        "status": "on",
        "sub_rule": [
            {
                "name": "司机列表",
                "number": 14,
                "title": "driver_list",
                "route": "/v1/driver/list,/v1/franchisee/list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "编辑司机信息",
                        "number": 37,
                        "title": "",
                        "route": "/v1/driver/edit-driver",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            },
            {
                "name": "司机审核",
                "number": 15,
                "title": "driver_auth",
                "route": "/v1/driver/driver-auth-list,/v1/franchisee/list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "编辑司机审核",
                        "number": 38,
                        "title": "",
                        "route": "/v1/driver/edit-driver-auth",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            },
            {
                "name": "司机资质列表",
                "number": 72,
                "title": "",
                "route": "/v1/driver/qualification-list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "审核司机资质",
                        "number": 73,
                        "title": "",
                        "route": "/v1/driver/edit-qualification",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            }
        ],
        "switchStatus": true
    },
    {
        "name": "车辆管理",
        "number": 4,
        "title": "car",
        "route": "",
        "source_type": "0",
        "status": "on",
        "sub_rule": [
            {
                "name": "车辆列表",
                "number": 16,
                "title": "car_list",
                "route": "/v1/car/list",
                "source_type": "0",
                "status": "on",
                "sub_rule": [
                    
                ],
                "switchStatus": true
            },
            {
                "name": "车辆审核",
                "number": 17,
                "title": "car_auth",
                "route": "/v1/car/car-auth",
                "source_type": "0",
                "status": "on",
                "sub_rule": [
                    
                ],
                "switchStatus": true
            }
        ],
        "switchStatus": true
    },
    {
        "name": "运营管理",
        "number": 5,
        "title": "operation",
        "route": "",
        "source_type": "0",
        "status": "off",
        "sub_rule": [
            {
                "name": "城市管理",
                "number": 18,
                "title": "operation_city",
                "route": "/v1/operation/city/city",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "车型开放",
                        "number": 28,
                        "title": "operation_city_service",
                        "route": "/v1/operation/city/service",
                        "source_type": "0",
                        "status": "off",
                        "sub_rule": [
                            {
                                "name": "编辑车型开放",
                                "number": 39,
                                "title": "",
                                "route": "/v1/operation/city/service",
                                "source_type": "1",
                                "status": "off",
                                "sub_rule": [
                                    
                                ],
                                "switchStatus": false
                            }
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "车型配置",
                        "number": 29,
                        "title": "operation_city_car",
                        "route": "/v1/operation/city/car-config",
                        "source_type": "0",
                        "status": "off",
                        "sub_rule": [
                            {
                                "name": "编辑车型配置",
                                "number": 40,
                                "title": "",
                                "route": "/v1/operation/city/car-config",
                                "source_type": "1",
                                "status": "off",
                                "sub_rule": [
                                    
                                ],
                                "switchStatus": false
                            }
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "抽成配置",
                        "number": 30,
                        "title": "operation_city_commission",
                        "route": "/v1/operation/city/commission-config",
                        "source_type": "0",
                        "status": "off",
                        "sub_rule": [
                            {
                                "name": "编辑抽成配置",
                                "number": 41,
                                "title": "",
                                "route": "/v1/operation/city/commission-config",
                                "source_type": "1",
                                "status": "off",
                                "sub_rule": [
                                    
                                ],
                                "switchStatus": false
                            }
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "动态折扣",
                        "number": 31,
                        "title": "operation_city_dynamic",
                        "route": "/v1/operation/city/dynamic-config,/v1/operation/city/service",
                        "source_type": "0",
                        "status": "off",
                        "sub_rule": [
                            {
                                "name": "编辑动态折扣",
                                "number": 42,
                                "title": "",
                                "route": "/v1/operation/city/dynamic-config",
                                "source_type": "1",
                                "status": "off",
                                "sub_rule": [
                                    
                                ],
                                "switchStatus": false
                            }
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "优惠券配置",
                        "number": 32,
                        "title": "operation_city_coupon",
                        "route": "/v1/operation/coupon/coupon",
                        "source_type": "0",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            },
            {
                "name": "司机等级",
                "number": 19,
                "title": "operation_driver",
                "route": "/v1/operation/driver/driver-level",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    
                ],
                "switchStatus": false
            },
            {
                "name": "优惠券",
                "number": 20,
                "title": "operation_coupon",
                "route": "/v1/operation/city/coupon-list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "添加城市券",
                        "number": 43,
                        "title": "",
                        "route": "/v1/operation/city/add-coupon",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "编辑城市券",
                        "number": 44,
                        "title": "",
                        "route": "/v1/operation/city/edit-coupon",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            },
            {
                "name": "消息管理",
                "number": 21,
                "title": "operation_message",
                "route": "",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "司机消息",
                        "number": 33,
                        "title": "operation_message_driver",
                        "route": "",
                        "source_type": "0",
                        "status": "off",
                        "sub_rule": [
                            {
                                "name": "司机个人消息",
                                "number": 51,
                                "title": "",
                                "route": "/v1/operation/message/driver-message",
                                "source_type": "0",
                                "status": "off",
                                "sub_rule": [
                                    {
                                        "name": "编辑司机个人消息",
                                        "number": 74,
                                        "title": "",
                                        "route": "/v1/operation/message/edit-driver-message",
                                        "source_type": "1",
                                        "status": "off",
                                        "sub_rule": [
                                            
                                        ],
                                        "switchStatus": false
                                    },
                                    {
                                        "name": "添加司机个人消息",
                                        "number": 78,
                                        "title": "",
                                        "route": "/v1/operation/message/add-driver-message",
                                        "source_type": "1",
                                        "status": "off",
                                        "sub_rule": [
                                            
                                        ],
                                        "switchStatus": false
                                    }
                                ],
                                "switchStatus": false
                            },
                            {
                                "name": "司机系统消息",
                                "number": 52,
                                "title": "",
                                "route": "/v1/operation/message/driver-system-message",
                                "source_type": "0",
                                "status": "off",
                                "sub_rule": [
                                    {
                                        "name": "编辑司机系统消息",
                                        "number": 75,
                                        "title": "",
                                        "route": "/v1/operation/message/driver-system-message,/v1/operation/city/city",
                                        "source_type": "1",
                                        "status": "off",
                                        "sub_rule": [
                                            
                                        ],
                                        "switchStatus": false
                                    },
                                    {
                                        "name": "添加司机系统消息",
                                        "number": 79,
                                        "title": "",
                                        "route": "/v1/operation/message/add-driver-system-message,/v1/operation/city/city",
                                        "source_type": "1",
                                        "status": "off",
                                        "sub_rule": [
                                            
                                        ],
                                        "switchStatus": false
                                    }
                                ],
                                "switchStatus": false
                            }
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "加盟商消息",
                        "number": 34,
                        "title": "operation_message_franchisee",
                        "route": "",
                        "source_type": "0",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "乘客消息",
                        "number": 35,
                        "title": "operation_message_passenger",
                        "route": "",
                        "source_type": "0",
                        "status": "off",
                        "sub_rule": [
                            {
                                "name": "乘客个人消息",
                                "number": 53,
                                "title": "",
                                "route": "/v1/operation/message/passenger-message",
                                "source_type": "0",
                                "status": "off",
                                "sub_rule": [
                                    {
                                        "name": "编辑乘客个人消息",
                                        "number": 76,
                                        "title": "",
                                        "route": "/v1/operation/message/passenger-message",
                                        "source_type": "1",
                                        "status": "off",
                                        "sub_rule": [
                                            
                                        ],
                                        "switchStatus": false
                                    },
                                    {
                                        "name": "添加乘客个人消息",
                                        "number": 80,
                                        "title": "",
                                        "route": "/v1/operation/message/add-passenger-message",
                                        "source_type": "1",
                                        "status": "off",
                                        "sub_rule": [
                                            
                                        ],
                                        "switchStatus": false
                                    }
                                ],
                                "switchStatus": false
                            },
                            {
                                "name": "乘客系统消息",
                                "number": 54,
                                "title": "",
                                "route": "/v1/operation/message/passenger-system-message",
                                "source_type": "0",
                                "status": "off",
                                "sub_rule": [
                                    {
                                        "name": "编辑乘客系统消息",
                                        "number": 77,
                                        "title": "",
                                        "route": "/v1/operation/message/passenger-system-message,/v1/operation/city/city",
                                        "source_type": "1",
                                        "status": "off",
                                        "sub_rule": [
                                            
                                        ],
                                        "switchStatus": false
                                    },
                                    {
                                        "name": "添加乘客系统消息",
                                        "number": 81,
                                        "title": "",
                                        "route": "/v1/operation/message/add-passenger-system-message,/v1/operation/city/city",
                                        "source_type": "1",
                                        "status": "off",
                                        "sub_rule": [
                                            
                                        ],
                                        "switchStatus": false
                                    }
                                ],
                                "switchStatus": false
                            }
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            }
        ],
        "switchStatus": false
    },
    {
        "name": "订单管理",
        "number": 6,
        "title": "order",
        "route": "",
        "source_type": "0",
        "status": "off",
        "sub_rule": [
            {
                "name": "订单列表",
                "number": 47,
                "title": "",
                "route": "/v1/order/list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "订单详情",
                        "number": 45,
                        "title": "",
                        "route": "/v1/order/details,/v1/order/track",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "修改订单",
                        "number": 46,
                        "title": "",
                        "route": "/v1/order/edit-order",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "平台垫付",
                        "number": 62,
                        "title": "",
                        "route": "/v1/order/pay-order",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "下载订单",
                        "number": 63,
                        "title": "",
                        "route": "/v1/order/upload",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            }
        ],
        "switchStatus": false
    },
    {
        "name": "财务管理",
        "number": 7,
        "title": "finance",
        "route": "",
        "source_type": "0",
        "status": "off",
        "sub_rule": [
            {
                "name": "财务统计",
                "number": 22,
                "title": "finance_home",
                "route": "/v1/passenger/list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    
                ],
                "switchStatus": false
            },
            {
                "name": "司机提现",
                "number": 23,
                "title": "finance_driver_cashout",
                "route": "/v1/finance/driver-cashout",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "拒绝司机提现",
                        "number": 64,
                        "title": "",
                        "route": "/v1/finance/refuse-driver-cashout",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "同意司机提现",
                        "number": 65,
                        "title": "",
                        "route": "/v1/finance/agree-driver-cashout",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            },
            {
                "name": "加盟商提现",
                "number": 24,
                "title": "finance_franchisee_cashout",
                "route": "",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    
                ],
                "switchStatus": false
            }
        ],
        "switchStatus": false
    },
    {
        "name": "加盟商管理",
        "number": 8,
        "title": "franchisee",
        "route": "",
        "source_type": "0",
        "status": "off",
        "sub_rule": [
            {
                "name": "加盟商列表",
                "number": 25,
                "title": "franchisee_list",
                "route": "/v1/franchisee/list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    
                ],
                "switchStatus": false
            }
        ],
        "switchStatus": false
    },
    {
        "name": "投诉管理",
        "number": 9,
        "title": "complaint",
        "route": "",
        "source_type": "0",
        "status": "off",
        "sub_rule": [
            {
                "name": "司机投诉",
                "number": 26,
                "title": "complaint_driver",
                "route": "/v1/complaint/driver-complaint",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "司机投诉进度",
                        "number": 66,
                        "title": "",
                        "route": "/v1/complaint/driver-complaint-progress",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "编辑司机投诉",
                        "number": 67,
                        "title": "",
                        "route": "/v1/complaint/edit-driver-complaint",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "添加司机投诉",
                        "number": 68,
                        "title": "",
                        "route": "/v1/complaint/add-driver-complaint",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            },
            {
                "name": "乘客投诉",
                "number": 27,
                "title": "complaint_passenger",
                "route": "/v1/complaint/passenger-complaint",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "乘客投诉进度",
                        "number": 69,
                        "title": "",
                        "route": "/v1/complaint/passenger-complaint-progress",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "编辑乘客投诉",
                        "number": 70,
                        "title": "",
                        "route": "/v1/complaint/edit-passenger-complaint",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "添加乘客投诉",
                        "number": 71,
                        "title": "",
                        "route": "/v1/complaint/add-passenger-complaint",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            }
        ],
        "switchStatus": false
    },
    {
        "name": "权限管理",
        "number": 10,
        "title": "permission",
        "route": "",
        "source_type": "0",
        "status": "off",
        "sub_rule": [
            {
                "name": "用户组管理",
                "number": 48,
                "title": "",
                "route": "/v1/permission/role/list,/v1/permission/role/all",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "修改用户组",
                        "number": 49,
                        "title": "",
                        "route": "/v1/permission/role/edit-role",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "添加用户组",
                        "number": 50,
                        "title": "",
                        "route": "/v1/permission/role/add-role,/v1/permission/role/all",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "用户组详情",
                        "number": 55,
                        "title": "",
                        "route": "/v1/permission/role/details",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "编辑用户组权限",
                        "number": 59,
                        "title": "",
                        "route": "/v1/permission/role/edit-role-permission,/v1/permission/role/all",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            },
            {
                "name": "账号管理",
                "number": 56,
                "title": "",
                "route": "/v1/permission/manager/list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    {
                        "name": "添加账号",
                        "number": 57,
                        "title": "",
                        "route": "/v1/permission/role/add-manager,/v1/permission/role/list,/v1/operation/city/city",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    },
                    {
                        "name": "编辑账号",
                        "number": 58,
                        "title": "",
                        "route": "/v1/permission/manager/edit-manager",
                        "source_type": "1",
                        "status": "off",
                        "sub_rule": [
                            
                        ],
                        "switchStatus": false
                    }
                ],
                "switchStatus": false
            }
        ],
        "switchStatus": false
    },
    {
        "name": "日志管理",
        "number": 11,
        "title": "log",
        "route": "",
        "source_type": "0",
        "status": "off",
        "sub_rule": [
            {
                "name": "管理员登录日志",
                "number": 60,
                "title": "",
                "route": "/v1/log/login-list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    
                ],
                "switchStatus": false
            },
            {
                "name": "管理员操作日志",
                "number": 61,
                "title": "",
                "route": "/v1/log/operation-list",
                "source_type": "0",
                "status": "off",
                "sub_rule": [
                    
                ],
                "switchStatus": false
            }
        ],
        "switchStatus": false
    }
]
阅读 5.9k
2 个回答

@node-click=(data,node)=>...node包含了parent,自己写个while拿所有的parent即可

// 根据子节点id查询所有父节点id
function getParent (array, key) {
  let result = [];
  let toToo = true;
  const catchData = (array, key) => {
    array.forEach( item => {
      if (!toToo) return;
      result.push(String(item['id']));
      if (item['id'] === key) {
        toToo = false;
      } else if (item['children']) {
        catchData(item['children'], key);
      } else {
        result.pop();
      }
    });
    toToo && result.pop();
  };
  catchData(array, key);
  return result;
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题