zoukankan      html  css  js  c++  java
  • js递归循环——将已有的数据处理生成一个新的数据

    场景:

    以下为已有数据,过滤掉数据中  selectedStatus为false的数据,并生成一组新数据(注意:不能在原数据中进行操作)

    let treeData = [
        {
            level: 0,
            parent_id: 0,
            name: "员工管理",
            id: 2,
            status: 1,
            selectedStatus:true,
            child: [
                {
                    level: 1,
                    parent_id: 2,
                    name: "办理入职",
                    id: 3,
                    status: 1,
                    selectedStatus:false,
                    child: [
                        {
                            level: 2,
                            parent_id: 3,
                            name: "直接办理入职",
                            id: 4,
                            status: 1,
                            selectedStatus:false,
                            child:[]
                        },
                    ]
                },
                {
                    level: 1,
                    parent_id: 2,
                    name: "转正管理",
                    id: 5,
                    status: 1,
                    selectedStatus:true,
                    child: [
                        {
                            level: 2,
                            parent_id: 5,
                            name: "办理转正",
                            id: 6,
                            status: 1,
                            selectedStatus:true,
                            child:[]
                        }
                    ]
                }
            ]
        },{
            level: 0,
            parent_id: 0,
            name: "员工管理",
            id: 2,
            status: 1,
            selectedStatus:false,
        },{
            level: 0,
            parent_id: 0,
            name: "员工管理",
            id: 2,
            status: 1,
            selectedStatus:true,
            child: [
                {
                    level: 1,
                    parent_id: 2,
                    name: "办理入职",
                    id: 3,
                    status: 1,
                    selectedStatus:false,
                    child:[]
                },
                {
                    level: 1,
                    parent_id: 2,
                    name: "转正管理",
                    id: 5,
                    status: 1,
                    selectedStatus:true,
                    child: [
                        {
                            level: 2,
                            parent_id: 5,
                            name: "办理转正",
                            id: 6,
                            status: 1,
                            selectedStatus:true,
                            child:[]
                        },{
                            level: 2,
                            parent_id: 5,
                            name: "办理转正",
                            id: 7,
                            status: 1,
                            selectedStatus:true,
                            child:[]
                        },{
                            level: 2,
                            parent_id: 5,
                            name: "办理转正",
                            id: 8,
                            status: 1,
                            selectedStatus:true,
                            child:[]
                        }
                    ]
                }
            ]
        },
    ]

    实现方式:

    turn_format(list) {
       //此处将数据转为json,然后再转为对象,是为了避免操作原数据 let list_json
    = JSON.stringify(list); let arr = JSON.parse(list_json) return arr.filter((item) => { if (!item.selectedStatus) { return false; }else{ if (item.child){ item.childthis.turn_format(item.child); delete item.selectedStatus }else{ delete item.selectedStatus } return true; } }); } //查看过滤后的数据 console.log(this.turn_format(treeData));
  • 相关阅读:
    HTML5和CSS3基础教程(第8版)-读书笔记(3)
    HTML5和CSS3基础教程(第8版)-读书笔记(2)
    HTML5和CSS3基础教程(第8版)-读书笔记
    JavaScript高级程序设计-读书笔记(7)
    HTTP状态码列表
    vue 监听对象里的特定数据
    vue 项目中命名方法
    一些常用文件夹和类的一些命名
    点将产品前端架构重构
    常用正则表达式总结
  • 原文地址:https://www.cnblogs.com/dreamstartplace/p/14892694.html
Copyright © 2011-2022 走看看