深圳商城网站,15年做哪个网站能致富,成都专业的网站建站公司,17做网店这个网站做起多少钱说明
在业务逻辑中#xff0c; 往往需要将后端的数据进行格式化 下面代码片是后端给的数据#xff0c;但在使用el-tree或者是el-cascader时#xff0c;这种格式数据并不能直接使用#xff0c;需要进行改造 {id: 8750,name: 监控大屏,…说明
在业务逻辑中 往往需要将后端的数据进行格式化 下面代码片是后端给的数据但在使用el-tree或者是el-cascader时这种格式数据并不能直接使用需要进行改造 {id: 8750,name: 监控大屏,sort: 10,path: monitor,component: layout,type: 0,permission: ,componentName: ,icon: icon-a-yunyingtongji2x,cache: false,hidden: false,pid: 0,iframeSrc: ,children: [{id: 8751,name: 大屏,sort: 1601,path: bigScreen,component: monitor/BigScreen,type: 1,permission: monitor:overview,componentName: ,icon: ,cache: false,hidden: false,pid: 8750,iframeSrc: ,children: [{id: 8803,name: 导出,sort: 160101,path: ,component: ,type: 2,permission: monitor-overview:export,componentName: ,icon: ,cache: false,hidden: true,pid: 8751,iframeSrc: ,children: null,createTime: 2024-01-11 14:45:44,description: ,subSystem: ,iframe: false}],createTime: 2023-04-18 17:04:38,description: ,subSystem: ,iframe: false},{id: 8753,name: 大屏设置,sort: 1602,path: screenconfig,component: monitor/ScreenConfig.vue,type: 1,permission: monitor:config,componentName: ,icon: ,cache: false,hidden: false,pid: 8750,iframeSrc: ,children: [{id: 8801,name: 保存,sort: 160201,path: ,component: ,type: 2,permission: monitor:save,componentName: ,icon: ,cache: false,hidden: true,pid: 8753,iframeSrc: ,children: null,createTime: 2024-01-11 14:44:29,description: ,subSystem: ,iframe: false}],createTime: 2023-04-21 11:50:06,description: ,subSystem: ,iframe: false}],createTime: 2023-04-18 16:57:28,description: ,subSystem: ,iframe: false},el-cascader组件需要改造成的数据格式
options: [{value: zhinan,label: 指南,children: [{value: shejiyuanze,label: 设计原则,children: [{value: yizhi,label: 一致}, {value: fankui,label: 反馈}, {value: xiaolv,label: 效率}, {value: kekong,label: 可控}]}, {value: daohang,label: 导航,children: [{value: cexiangdaohang,label: 侧向导航}, {value: dingbudaohang,label: 顶部导航}]}]},代码说明
这种树形的代码格式一般是使用递归方法写 // 获取后端接口async getModuleList() {let treeDetail [];await GetMenusTreeDetail().then((res) {treeDetail res.data;});treeDetail.forEach((item) {this.treeList.push(this.getModuleObject(item));});},
// 递归构建功能模块对象 return的格式可以根据业务要求来getModuleObject(obj) {if (!obj.children)return {id: obj.id,name: obj.name,children: null,};const temp {id: obj.id,name: obj.name,children: [],};obj.children.forEach((item) {temp.children.push(this.getModuleObject(item));});return temp;},
