当前位置: 首页 > news >正文

element---tree树形结构(返回的数据与官方的不一样)

项目中要用到属性结构数据,后端返回的数据不是官方默认的数据结构:

		<el-tree:data="treeData":filter-node-method="filterNode":props="defaultProps"@node-click="handleNodeClick"></el-tree>

这是文档默认的树形数据结构:

data: [{label: '一级 1',children: [{label: '二级 1-1',children: [{label: '三级 1-1-1'}]}]}, {label: '一级 2',children: [{label: '二级 2-1',children: [{label: '三级 2-1-1'}]}, {label: '二级 2-2',children: [{label: '三级 2-2-1'}]}]}]

后端返回回来的:

[{"id": "1399521221730304","email": "123@qq.com","child": [{"id": "1399659790548992","email": "1234@qq.com","child": [{"id": "1400165901697024","email": "fj@qq.com","child": [{"id": "1400671389548544","email": "fjj@qq.com","child": null}]}]},{"id": "1400156697001984","email": "277@qq.com","child": null}]},{"id": "1399527282712576","email": "147852@qq.com","child": null},]

直接使用数据树形结构展示不出来,可以改变默认展示的数据格式:

defaultProps: {children: 'child',label: 'email'},

在这里插入图片描述

http://www.lryc.cn/news/313510.html

相关文章:

  • Spring Boot工程集成验证码生成与验证功能教程
  • Bert Encoder和Transformer Encoder有什么不同
  • 外汇天眼:频繁交钱却无法出金,只因误入假冒HFM惨成冤大头!
  • Linux-信号3_sigaction、volatile与SIGCHLD
  • STM32 | STM32时钟分析、GPIO分析、寄存器地址查找、LED灯开发(第二天)
  • Python常用语法汇总(一):字符串、列表、字典操作
  • Token的奥秘--一起学习吧之token
  • FlinkCDC快速搭建实现数据监控
  • 应急布控球远程视频监控方案:视频监控平台EasyCVR+4G/5G应急布控球
  • 3.6 C语言和汇编语言混合编程 “每日读书”
  • 利用“定时执行专家”循环执行BAT、VBS、Python脚本——含参数指定功能
  • 【算法集训】基础算法:模拟
  • 基于SSM的房客源信息管理系统设计与实现
  • 常见数据类型
  • 基于vue的联通积分商城数据可视化APP设计与实现
  • 2024年flink面试真题(一)
  • Java面试挂在线程创建后续,不要再被八股文误导了!创建线程的方式只有1种
  • JavaEE面试题
  • 探索macOS上的最佳MySQL客户端工具
  • [Android] MediaPlayer SDK API glance
  • 原始手写helloworld并打jar包允许
  • maven 的安装与配置(Command ‘mvn‘ not found)修改配置文件后新终端依旧无法识别到 mvn 命令
  • Pycharm无法粘贴外部文本问题
  • 学习Java的第四天
  • 【Javaweb】【瑞吉外卖】登录功能plus--拦截器filterinterceptors实现
  • 关于 Runes 协议及「公开铭刻」发行机制的拓展讨论
  • chkdsk修复会造成文件丢失吗?chkdsk数据丢失还能恢复吗
  • Hypermesh2019快捷键大全
  • CSS布局——Flexbox基础使用
  • Kubernetes(K8s):容器化应用的航空母舰