级联回显 -- 寻找从属关系公共方法

最新推荐文章于 2024-08-08 18:29:24 发布

前端小溪

最新推荐文章于 2024-08-08 18:29:24 发布

阅读量167

点赞数

分类专栏： vue javascript

本文链接：https://blog.csdn.net/weixin_44952258/article/details/107307253

版权

javascript 同时被 2 个专栏收录

15 篇文章 0 订阅

订阅专栏

vue

13 篇文章 1 订阅

订阅专栏

结果展示
在这里插入图片描述

export function regroupCascaderData(
    id, //要寻找的唯一值
    data, // 列表总数据
    key = 'label', //列表总数据 的key
    val = 'value', //列表总数据 的value
    list = 'children' //列表总数据 下属关系的key
  ) {
    let _allObj = {}
    const _allArr = []
    const setData = function(data) {
      let Obj
      for (const item of data) {
        Obj = {
          [key]: item[key],
          [val]: item[val]
        }
        if (item[val] == id) {
          Obj['isOk'] = true //如果条件符合，接下来就不会再判断
          return Obj
        } else if (item[list] && item[list].length) {
          Obj[list] = setData(item[list])
          if (Obj[list] && Obj[list]['isOk']) {
            Obj['isOk'] = true
            return Obj
          }
        } else {
          Obj = null
        }
      }
      return Obj
    }
    const getObjData = function(data) {
      // 递归向数组中填充数据 
      _allArr.push(data[val])
      if (data[list]) {
        getObjData(data[list])
      }
    }
    _allObj = setData(data)
    getObjData(_allObj)
    return {
      Obj: _allObj,
      arr: _allArr
    }
  }

//引用
const arr1 = regroupCascaderData(
            32,
            this.options,
            "label",
            "value",
            "children"
          );
console.log(arr1['arr'],"==========");