js遍歷多層對象的鍵值對


最項目需要用到el-tree,后端竟然不會構造數據,最后還得自己來搞

testHandle() {
  console.log('==================')
  let list1 = {  //后端只能處理成這樣
    氣象: {
      極飛: {
        IWS7: {
          巴里坤1號站: 'xxx',
          巴里坤2號站: 'xxx',
          氣象站: 'xxx'
        },
        IWS3: {
          新果園溫濕度儀: 'xxx'
        }
      }
    },
    視頻: {
      極飛: {
        IFC16S: {
          新果園苗情監測: 'xxx',
          老果園苗情監測: 'xxx'
        }
      }
    }
  }
  let newList1 = []
  // tree1 子系統
  let tree1 = list1
  Object.keys(tree1).forEach(item1 => {
    // console.log(item1, tree1[item1]) //氣象 {極飛: {…}}
    // tree2 設備商
    let tree2 = tree1[item1]
    let child2 = []
    Object.keys(tree2).forEach(item2 => {
      // console.log(item2, tree2[item2]) //極飛 {IWS7: {…}, IWS3: {…}}
      // tree3 型號
      let tree3 = tree2[item2]
      let child3 = []
      Object.keys(tree3).forEach(item3 => {
        // console.log(item3, tree3[item3]) //IFC16S {新果園苗情監測: "xxx", 老果園苗情監測: "xxx"}
        // tree4 設備
        let tree4 = tree3[item3]
        let child4 = []
        Object.keys(tree4).forEach(item4 => {
          // console.log(item4, tree4[item4]) //新果園苗情監測 xxx
          let one = { label: item4, value: tree4[item4] }
          // console.log(one)  //{label: "巴里坤1號站", value: "xxx"}
          child4.push(one)
        })
        let one = { label: item3, value: item3, children: child4 }
        // console.log(one) //{label: "IWS7", value: "IWS7", children: Array(3)}
        child3.push(one)
      })

      let one = { label: item2 + '設備', value: item2, children: child3 }
      // console.log(one) //{label: "極飛設備", value: "極飛", children: Array(2)}
      child2.push(one)
    })

    // let subSysName = this.subSysName
    let subSysName = {
      氣象: '田間氣象',
      土壤: '墒情分析',
      視頻: '苗請監測',
      井電: '井電能效',
      灌溉: '智慧灌溉',
      施肥: '智能施肥'
    }

    let one = { label: subSysName[item1] + '子系統', value: item1, children: child2 }
    // console.log(one) //{label: "田間氣象子系統", value: "氣象", children: Array(1)}
    newList1.push(one)
  })
  console.log(newList1) //ok
},

lebel要套不同的內容,不好迭代,暫時手動嵌套,不知道還有沒有更優雅的寫法


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM