主要是在组件和后端返回的数据之间,或者组件产⽣的数据和需要提交给后端的数据之间,有可能会出 现结构对不上,这个时候可能会处理⼀下,举个例⼦,⽐如说我们常⽤的tree型组件要求必须是嵌套的 tree型数组,这个时候就需要处理⼀下,再⽐如提交的时候接⼝要求的是字符串,我们组件给到的数组, 也需要处理

追问: 既然说到了树形处理,说⼀下处理的思路

树形数据处理,通常后端那边返回的格式是⼀个普通的平铺结构,不过⼀般都会有⼀个pid字段,可以根 据它找到⾃⼰的⽗节点,那办法就有了,或者使⽤递归的⽅式,性能好⼀点的话可以采⽤⾮递归的⽅式 都可以,主要还是⼀个寻找⽗节点的过程 继续追问:

详细说说呢,伪代码思路是怎么样⼦的?

我们可以按照下⾯的步骤去写这个处理函数 1. 可以先遍历原数组以它的id作为key,本身作为value形成⼀个对象结构 2. 再次遍历原数组,通过每⼀项的pid字段取第⼀步形成的对象中尝试进⾏对象取值,如果取到了值就 把⾃⼰push到它chilren属性中,如果找不到代表它本身就是最外层的⽗节点,直接push到函数最终 产出的数组中

⼯作中有做过数据处理吗? tree 组件 根据 pid 寻找父节点的更多相关文章

  1. [CareerCup] 4.7 Lowest Common Ancestor of a Binary Search Tree 二叉树的最小共同父节点

    4.7 Design an algorithm and write code to find the first common ancestor of two nodes in a binary tr ...

  2. [LeetCode] Lowest Common Ancestor of a Binary Tree 二叉树的最小共同父节点

    Given a binary tree, find the lowest common ancestor (LCA) of two given nodes in the tree. According ...

  3. Element ui tree树形控件获取父节点id

    Element-ui官网给的方法 getCheckedKeys() { console.log(this.$refs.tree.getCheckedKeys()); }, 这种只有在所有子级都被选中的 ...

  4. [LeetCode] 236. Lowest Common Ancestor of a Binary Tree 二叉树的最小共同父节点

    Given a binary tree, find the lowest common ancestor (LCA) of two given nodes in the tree. According ...

  5. antd tree组件文件名换行 + 点击展开时,自动收起同级其他展开目录

    1.在项目中用 antd的tree组件的时候,遇到两个问题 1.文件名太长的话 会超出容器 很难看,解决方法如下 ` 引入css在global下设置 :global { .ant-tree li .a ...

  6. 【技术博客】使用iview的Tree组件写一棵文件树

    本次项目的前端部分使用vue框架+iview组件构建,其中IDE的文件树部分使用了iview的Tree组件,但是Tree组件本身的接口功能极其有限,网上的相关资料也不多,在使用时费了一番功夫才摸索清楚 ...

  7. [置顶] Flex中Tree组件无刷新删除节点

    在Tree组件中经常要删除某个节点,而删除之后重新刷新加载该Tree组件会影响整个操作效果和效率,因此,无刷新删除就比较好,既删除了节点也没有刷新tree,而使Tree的状态处于删除之前的状态. 无刷 ...

  8. Easyui中tree组件实现搜索定位功能及展开节点定位

    这几天遇到个input + tree  实现搜索功能的需求,在这里贴出来供大家参考下,如果你有更好的实现效果希望不腻赐教! 首先给大家看看效果     小二 上图  : 需要的部件知识: easyui ...

  9. 【Egret】中tree组件使用案例

    Egret中tree组件使用案例,包含(文本过多时,自动换行功能) 下面代码结合http://bbs.egret.com/forum.php?mod=viewthread&tid=19028& ...

  10. antd Tree组件中,自定义右键菜单

    最近项目中,有一个需求是自定义antd的Tree组件的右键菜单功能. 直接上代码 class Demo extends Component { state = { rightClickNodeTree ...

随机推荐

  1. 《最新出炉》系列初窥篇-Python+Playwright自动化测试-62 - 判断元素是否可操作

    1.简介 有些页面元素的生命周期如同流星一闪,昙花一现.我们也不知道这个元素在没在页面中出现过,为了捕获这一美好瞬间,让其成为永恒.我们就来判断元素是否显示出现过. 在操作元素之前,可以先判断元素的状 ...

  2. 【Maxwell】03 定向监听&全量输出

    一.定向监听 定向监听,即只监听某一个特定的表,或者库 1.创建样本案例 -- 创建监听的库(演示样本) CREATE DATABASE `test-db-2` CHARACTER SET 'utf8 ...

  3. 【Mybatis】08 ResultMap、Association、分步查询、懒加载

    ResultMap自定义结果集 可以把查询返回的结果集封装成复杂的JavaBean对象 原来的ResultType属性,只能把查询到的结果集转换为简单的JavaBean 什么是简单的JavaBean对 ...

  4. 【Git】介绍与概述

    版本控制工具应该具备的功能? 协同修改 多人并行不悖的修改服务器端的同一个文件. 数据备份 不仅保存目录和文件的当前状态,还能够保存每一个提交过的历史状态. 版本管理 在保存每一个版本的文件信息的时候 ...

  5. 【Java,IDEA】使用IDEA自动生成序列化ID

    一.设置序列化的原因: 详细见SE的IO流问题: https://www.cnblogs.com/mindzone/p/12752453.html 简单点理解就是对象的身份证号, 对于一些对象被序列之 ...

  6. ubuntu系统下 vscode中如何指定conda环境

    参考: https://blog.csdn.net/mieleizhi0522/article/details/89336321 =================================== ...

  7. 【入门教程】5分钟教你快速学会集成Java springboot ~

    介绍 Apache DolphinScheduler是一个分布式易扩展的开源分布式调度系统,支持海量数据处理,具有任务流程调度.任务流程编排.任务监控告警.工作流引擎等功能. 本文将介绍如何将Apac ...

  8. 第 358 场周赛 - 力扣(LeetCode)

    第 358 场周赛 - 力扣(LeetCode) 2815. 数组中的最大数对和 - 力扣(LeetCode) 双for遍历即可 class Solution { public: int maxSum ...

  9. 轻松易懂,一文告诉你什么是http协议?

    阅读本文之前,请详细阅读以下几篇文章: <一文包你学会网络数据抓包> <教你如何抓取网络中的数据包!黑客必备技能> 一.什么是http? Http协议即超文本传送协议 (HTT ...

  10. 【CMake系列】10-cmake测试集成googletest与第三方库自动化构建

    cmake测试,使用ctest 可能不能满足我们的需求,需要我们使用更为强大的第三方测试框架,如googletest,完成项目中的测试工作 本篇文章将第三方测试框架 googletest,引入,同时也 ...