首页 > 其他分享 >el-tree只展示前三个节点数据

el-tree只展示前三个节点数据

时间:2022-11-04 10:47:06浏览次数:49  
标签:count el 展示 tree handleTreeData limit data 节点

后端也返回了第四等级,但是不想让他展示,可以这样解决只展示前三等级

 // 获取room树
    getRoomTreeList() {
      getRoomTree().then((res) => {
        // 只获取到单元楼节点
        function handleTreeData(data, limit = 3, count = 1) {
          return data?.map((x) => ({
            ...x,
            children:
              count < limit ? handleTreeData(x.children, limit, count + 1) : [],
          }));
        }
        this.treeData = handleTreeData(res.data);
      });
    },
  },
};

标签:count,el,展示,tree,handleTreeData,limit,data,节点
From: https://www.cnblogs.com/xuelinomen/p/16856916.html

相关文章

  • 二次封装 Vue-Treeselect 组件
    场景开发中多个地方都需要用到vue-treeselect组件,于是想二次封装成SelectTree组件便于使用。需求1:自定义选项样式插槽option-labelSelectTree组件预留插槽`diy-......
  • gridpanel header click
    varmyGrid=Ext.Create('Ext.grid.Panel',{renderTo:'shrGrid',renderTo:myGrid,store:myStore,//JSONobjectcolumns:myGrid.columns,//JS......
  • element-admin - 图片上传组件 ImageUpload
    预览详情:      父组件:注册引入子组件;只需要传递一个数据 limit ;子组件:-图片上传-el-upload<template><div><el-uploadaction="#......
  • cmake-子cmakelists传递变量
    主cmake子cmakePARENT_SCOPE传递回主cmake结果......
  • 02_IntelliJ IDEA常用快捷键
    【常见快捷键】Ctrl+Shift+Enter语句完成 “!”否定完成输入表达式时按“!”键Ctrl+E最近的文件 Ctrl+Shift+E最近更改的文件 Shift+Click可以......
  • ElasticSearch这些坑记得避开
    目录一、管理方式二、结构维护三、数据调度1、同步方案2、中断和恢复四、刷新策略五、深度分页六、参考源码Index用不好,麻烦事不会少;一、管理方式ElasticSearch作为最......
  • Penelope 16-30
    Penelope(蓝色小考拉)第16集是Penelopeit'sdelicious。Nearly.旁白:WhatisPenelopedoing?Oops.WhichoneshouldItry?Maybethischocolate,orI'llhavethis......
  • Penelope 1-15
    Penelope(蓝色小考拉)第13集是Penelopeispolite。第一个场景:Atschool旁白:Penelopehadlotsof  funatschooltoday.It'stimetogohomenow.Oh,that'smymu......
  • GPU-MLIR-DeepMind-Intel酷睿漫谈
    GPU-MLIR-DeepMind-Intel酷睿漫谈参考文献链接https://mp.weixin.qq.com/s/yyaN9WXlcdoRUjJ_5Diikghttps://mp.weixin.qq.com/s/Q5HUc22G3-RK7-IAiXvhCAhttps://mp.wei......
  • cmake-if-else
    if-else直接设置ON、OFF命令行设置ON、OFF......