zoukankan      html  css  js  c++  java
  • 递归判断多维数组中对象是否有值

    一个项目需求中,需要判断数组中的对象是否有值,先看下数据结构:

    data(){
      return {
          
        list = [
                  {
                        value: "1",
                        children: [
                            {
                                value: "2"
                            },
                            {
                                value: "3",
                                children: [
                                    {
                                        value: "4"
                                    }
                                ]
                            }
                        ]
                    },
                    {
                        value: "5",
                        children: [
                            {
                                value: "6",
                                children: [
                                    {
                                        value: "7"
                                    }
                                ]
                            }
                        ]
                    }
                ];

        }
    }

      那么如何进行判断多层子集是否有值呢?这里就会用到递归来实现   

    若使用vue搭建的工程项目

      我们可以现在methods中封装一个递归的方法

    //递归判断项目中存在对象
            ruleValidate(data) {
                let flag = true;
                function judgeChildren(data) {
                    data.forEach(e => {
                        if (!flag) {
                            return;
                        }
                        if (e.value) {
                            e.prop = e.value;   //给对象增加自定义的key , 很多情况下都会使用到自定义的key
                            e.lable = e.value;
                        }
                        if (!e.value) {
                            flag = false;
                            return;
                        } else if (e.children && e.children.length) {
                            e.children.prop= e.value;  //给对象增加自定义的key,很多情况下都会使用到自定义的key
                            e.children.lable = e.value;
                            judgeChildren(e.children);
                        }
                    });
                }
                judgeChildren(data);
                return data;
            },
    

      在created这个声明周期中,直接对数据进行处理

     this.dataObj = this.ruleValidate(this.list);
     console.log(this.dataObj);
    

      打印就可以看到  每个自定义的key值了,想要什么类型的数据,直接在封装的方法进行修改就ok了

  • 相关阅读:
    dstat
    centos安装指定版本的golang
    APP防CC为什么复杂
    火狐浏览器的书签如何自动在新窗口打开?
    linux jdk版本随时切换
    centos7 yum安装java环境
    kangle清除缓存接口
    CC攻击原理及防范方法
    GET 和 POST 的区别 以及为什么 GET请求 比 POST请求 更快
    HTTP缓存机制
  • 原文地址:https://www.cnblogs.com/wangqi2019/p/11264436.html
Copyright © 2011-2022 走看看