樹結構數組,js實現點擊某個節點,顯示該節點對應的所有父級節點

樹結構數組,js實現點擊某個節點,顯示該節點對應的所有父級節點

現有測試數組結構如下:如果輸入的id爲20102顯示的對應結果應該是['黑龍江','哈爾濱','呼蘭區']

city=[
{
        name:"北京",
        id:1,
},
{
   name:"黑龍江",
   id:2,
   children:[
     {
      name:'哈爾濱',
      id:20001,
      children:[
          {name:"松北區",
          id:20101},
          {name:"呼蘭區",
          id:20102},
          {name:"雙城區",
          id:20103},
      ]
     },
     {
      name:'齊齊哈爾',
      id:20002,
      children:[
          {name:"龍沙區",
          id:20201},
          {name:"建華區",
          id:20202},
          {name:"富拉爾基區",
          id:20203},
      ]
     },
     {
      name:'牡丹江',
      id:20003,
      children:[
          {name:"東安區",
          id:20301},
          {name:"西安區",
          id:20302},
          {name:"愛民區",
          id:20303},
      ]
      },
     {
      name:'佳木斯',
      id:20004,
      children:[
          {name:"富錦市",
          id:20401},
          {name:"同江市",
          id:20402},
          {name:"向陽區",
          id:20403},
      ]
      }
   ]
}
]

js代碼

var newArr=[],jsontxt={},jsonId={},currentId=20102,name="呼蘭區"
function func(){
    city.map(v=>{
        jsontxt[v.name]={};
        jsonId[v.id]={}
        if(v.id===currentId){
            newArr.push(v.name)
        }else{
            if(v.children)func2(v.children,jsontxt[v.name],jsonId[v.id],v.name,v.id)
        }
    })
}

function func2(data,json,json2,key,key2){
    data.map(v=>{
        json[v.name]={};
        json2[v.id]={};
        if(v.id===currentId){
            newArr.push(key);
            fun3(jsontxt[key],jsonId[key2])
        }else{
            if(v.children)func2(v.children,json[v.name],json2[v.id],key,key2)
        }
    })
}

fun3(data,data2){
    for(var i in data2){
        if(i===currentValue){
            for(var j in data){
                if(j===name)newArr.push(j)
            }
        }else{
            for(var k in data){
                if(!data2[currentId] && data[name] && JSON.stringify(data2[i])!=='{}' &&JSON.stringify(data[k])!=='{}'){
                    newArr.push(k);
                    func3(data[k],data2[i])
                }
            }
        }
    }
}

func();

後期繼續優化代碼.........

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章