iview tree 获取选中子节点的整条数据链

这样子获取到数据是,checked等于true的,获取不到他的父级,父级的父级

解决办法代码如下:

//需要有一个唯一ID

        //======================================
        //扩展remove方法
        Array.prototype.remove = function (val) {
          let index = this.indexOf(val);
          if (index > -1) {
            this.splice(index, 1);
          }
        };
        //======================================
        //获取整条数据链
        function getParent(array, childs, ids) {
          for (let i = 0; i < array.length; i++) {
            let item = array[i];
            if (Number(item.id) === Number(ids)) {
              childs.push(item);
              return childs;
            }
            if (item.children && item.children.length > 0) {
              childs.push(item);
              let rs = getParent(item.children, childs, ids);
              if (rs) {
                return rs;
              }
              else {
                childs.remove(item);
              }
            }
          }
          return false;
        }

        //获取所有选中节点
        let params = this.$refs.tree.getCheckedNodes();
        //所有数据
        let allData = [‘所有数据‘];
        //循环执行所有选中的节点链,放到arr1数组里
        let arr1 = [];
        for (let i = 0; i < params.length; i++) {
          //单条数据链
          let aData = getParent(allData, [], params[i].id);//方法入口在这里
          for (let y = 0; y < aData.length; y++) {
            //拆分成单个json数组放到arr1里
            arr1.push(aData[y]);
          }
        }

        //arr1去重 es6的set方法
        function dedupe(array) {
          return Array.from(new Set(array));
        }

        arr1 = dedupe(arr1);

这样就能获取完整的整条数据链

原文地址:https://www.cnblogs.com/qdwz/p/11015384.html

时间: 2024-10-23 20:38:53

iview tree 获取选中子节点的整条数据链的相关文章

EasyUI tree 选中父节点子节点全部选中,选中子节点父节点不选中

需求:EasyUI tree 选中父节点子节点全部选中,选中子节点父节点不选中 效果: /**   * 给树增加onCheck事件,首先使用cascadeCheck:false属性禁止全选,   * 然后获取当前选中节点的所有子节点,在判断其拥有子节点时对其所有字节点   * 进行遍历操作.在easyui中树节点的是否选中不是由checked:true   * 属性来控制,而是由class tree-checkbox0   * 和tree-checkbox1进行控制.--by wk   */  

asp.net 实现treeview 选中父节点其子节点也选种中 选中子节点其父节点与根节点也被选中

1.在 Page_Load(object sender, EventArgs e) 里面加入: TreeView1.Attributes.Add("onclick", "CheckEvent(event)");//TreeView1是树控件的名称. javascript 放到 <head></head> 之间 <script type="text/javascript"> <head runat=&quo

IT小鲜肉 Widgets Tree 单选、多选、相关回调函数、获取选中的节点功能

写一个树控件并没有想象中的那么容易,今天又花了我一个1个多小时,主要为IT小鲜肉 Widgets Tree控件添加了 单选.多选.选择前和选择后两个回调函数.获取选中节点的功能.后面会继续努力完善这个树控件. 1.通过设置初始化时候的选项{select:true}开启单选,通过设置初始化时候的选项{select:{type:'multiple'}}开启多选 使用实例代码如下: 运行效果如下: 2.添加了onBeforeSelect回调函数,用来实现自定义选择,如果该函数返回false会中断默认的

JQuery EasyUi Tree获取所有checkbox选中节点的id和内容

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>    <head>        <meta name="generator" content="HTML Tidy, see www.w3.org">      

FLEX中Tree默认展开全部节点

这里分两种情况,一种是数据源在MXML文件里,如: <mx:XML id="treeXML" format="e4x"> <root> <node label="通知通告管理" data="0"> <node label="申报通知" data="1" /> <node label="填表须知" data=&quo

easyui的datagrid获取选中行

注意设置idfield="id",这里的id要和下面field的id保持一致,而且要保证唯一性. easyui的datagrid获取选中行,布布扣,bubuko.com

父兄子节点的获取及子节点的添加、删除、克隆操作

第一.父兄子节点的获取 1.父节点的获取 某节点的parentNode属性值即为该节点的父节点.示例: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <body> <div id="father"> <div id="son1"></div> </

IE10、Chrome获取触发事件节点的源对象

记录学习JavaScript中遇到的知识点 1.IE中获取触发事件节点的源对象是通过属性srcElement,而Chrome则是以属性tagName获得.以如下函数getEventTarget(e)实现源对象的获取. 1 <script tyoe="text/JavaScript"> 2 //获取触发事件节点的源对象 3 function getEventTarget(e){ 4 e=window.event || e; 5 return e.srcElement || e

jQuery获取选中复选框的值代码实例

jQuery获取选中复选框的值代码实例:复选框是最为常用的表单元素之一,它提供了一种多选的方式,下面介绍一下如何使用jQuery获取选中的checkbox复选框的值.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/"