位置:首页 > web前端 > javascript

js循环遍历的方法 比for循环更好用

dearweb 发布:2021-10-22 09:57:07阅读:

你还在使用for循环进行遍历数组么?殊不知这样的方式已经比较落后了,虽然说性能占优,但是从写法上来说,令人比较难受,所以小编今天推荐一种比较不错的方式。话不多说直接上代码。

// data定义变量
data(){
    return {
        dataListTo: [
        {
          id: 501,
          children: [],
          level: null,
          label: '用户',
          select: false
        },
        {
          id: 502,
          children: [
            {
              id: 510,

              children: null,
              level: null,
              label: '卡类型管理',
              select: false
            },
            {
              id: 511,

              children: null,
              level: null,
              label: '福力卡管理',
              select: false
            },
            {
              id: 567,

              children: null,
              level: null,
              label: '兑换券管理',
              select: false
            }
          ],
          level: null,
          label: '福力',
          select: false
        },
        {
          id: 503,
          children: [
            {
              id: 512,

              children: null,
              level: null,
              label: '商品管理',
              select: false
            },
            {
              id: 513,

              children: null,
              level: null,
              label: '分类管理',
              select: false
            },
            {
              id: 514,

              children: null,
              level: null,
              label: '分区管理',
              select: false
            },
            {
              id: 515,

              children: null,
              level: null,
              label: '商品券密管理\r',
              select: false
            },
            {
              id: 516,

              children: null,
              level: null,
              label: '品牌管理',
              select: false
            },
            {
              id: 573,

              children: null,
              level: null,
              label: '商品标签管理',
              select: false
            },
            {
              id: 577,

              children: null,
              level: null,
              label: '品类管理',
              select: false
            }
          ],
          level: null,
          label: '商城',
          select: false
        },
        {
          id: 504,
          children: [
            {
              id: 517,

              children: null,
              level: null,
              label: '订单管理',
              select: false
            },
            {
              id: 579,

              children: null,
              level: null,
              label: '打款记录',
              select: false
            }
          ],
          level: null,
          label: '订单',
          select: false
        },
        {
          id: 505,
          children: [
            {
              id: 569,

              children: null,
              level: null,
              label: '微页面管理',
              select: false
            },
            {
              id: 521,

              children: null,
              level: null,
              label: '关于我们',
              select: false
            }
          ],
          level: null,
          label: '装修',
          select: false
        },
        {
          id: 506,
          children: [
            {
              id: 519,

              children: null,
              level: null,
              label: '销售流水',
              select: false
            },
            {
              id: 570,

              children: null,
              level: null,
              label: '业务员管理',
              select: false
            },
            {
              id: 571,

              children: null,
              level: null,
              label: '客户管理',
              select: false
            },
            {
              id: 572,

              children: null,
              level: null,
              label: '业务员订单',
              select: false
            },
            {
              id: 578,

              children: null,
              level: null,
              label: '打款审核',
              select: false
            }
          ],
          level: null,
          label: '财务',
          select: false
        },
        {
          id: 534,
          children: [
            {
              id: 556,

              children: null,
              level: null,
              label: '活动管理页',
              select: false
            }
          ],
          level: null,
          label: 'CMS',
          select: false
        },
        {
          id: 536,
          children: [
            {
              id: 537,

              children: null,
              level: null,
              label: '权限管理',
              select: false
            }
          ],
          level: null,
          label: '权限',
          select: false
        }
      ]
    }
}

// methods写法
methods: {
    dataFor(dataListTo) {
      dataListTo.map(o => {
        if (o.children && o.children.length > 0) {
          this.dataFor(o.children)
        } else {
          o.children = null
           
           // 将children长度为0的数组转为 null
        }
      })
      this.dataListTo = dataListTo
    }
  }


24人点赞 返回栏目 分享一波

小礼物走一波,支持作者

还没有人赞赏,支持一波吧

留言 评论仅代表网友个人 留言列表

暂无留言,快来抢沙发吧!

手机扫码查看 手机扫码查看