Javascript循環播放對象以查找匹配對網址

Question

我正在致力於reactjs項目 - 我在那裏說英文url，比如「/ en/how-it-works」，並希望通過json樹來查找位置/兒童級別設置此鏈接 - 並找到其德語匹配對。

所以基本上 - 這是給英國的URL的功能，返回德國的URL

如此 -

LNG - 返回去 currenlang - 恩 pairUrl -/EN /如何-IT-工作

回報/德/ anleitung

或

LNG - 回報恩 currentlang德 pairUrl - /德/熱門-projekte/bundle1

回報/ EN /流行的項目/ bundle1

//功能

getLanguagePair (lng, currentLng, pairUrl) { 
    // 'find url in json tree' 
    console.log('linkTreeObject', linkTreeObject.langs) 

    var obj = {} 
    //find position in tree 
    if(currentLng === 'de'){ 
     obj = linkTreeObject.langs[0].lines.menu 
    } else { 
     obj = linkTreeObject.langs[1].lines.menu 
    } 

    var pos = [] 
    for (var k in obj) { 
     if (!obj.hasOwnProperty(k)) continue 
     if (obj[k].link === pairUrl) { 
     pos[k] 
     } 
    } 
    console.log('pos' , pos) 

    if (lng === 'de') { 
     return '/de/link' 
    } else { 
     return '/en/link' 
    } 
} 

// JSON文件

{ 
    "langs" : [ 
     { 
      "lang" : "de", 
      "lines" : { 
       "menu" : [ 
        { 
         "title": "Anleitung", 
         "link": "/de/anleitung", 
         "children" : [] 
        }, 
        { 
         "title": "Beliebte Projekte", 
         "link": "/de/beliebte-projekte", 
         "children" : [ 
          { 
           "title" : "Bundle1", 
           "link" : "/de/beliebte-projekte/bundle1" 
          }, 
          { 
           "title" : "Bundle2", 
           "link" : "/de/beliebte-projekte/bundle2" 
          } 
         ] 
        } 
       ], 
       "sign_in"  : "Login" 
      } 
     }, 
     { 
      "lang" : "en", 
      "lines" : { 
       "menu" : [ 
        { 
         "title": "How it works", 
         "link": "/en/how-it-works", 
         "children" : [] 
        }, 
        { 
         "title": "Popular Projects", 
         "link": "/en/popular-projects", 
         "children" : [ 
          { 
           "title" : "Bundle1", 
           "link" : "/en/popular-projects/bundle1" 
          }, 
          { 
           "title" : "Bundle2", 
           "link" : "/en/popular-projects/bundle2" 
          } 
         ] 
        } 
       ], 
       "sign_in"  : "Sign in" 
      } 
     } 
    ] 
} 

Answer 1

您必須同時循環「en」和「de」，並使用遞歸，因爲您有嵌套的鏈接。這是我的版本。我已經拿出'en'和'de'數組並在函數中使用它們。

var obj ={ 
 
    "langs" : [ 
 
     { 
 
      "lang" : "de", 
 
      "lines" : { 
 
       "menu" : [ 
 
        { 
 
         "title": "Anleitung", 
 
         "link": "/de/anleitung", 
 
         "children" : [] 
 
        }, 
 
        { 
 
         "title": "Beliebte Projekte", 
 
         "link": "/de/beliebte-projekte", 
 
         "children" : [ 
 
          { 
 
           "title" : "Bundle1", 
 
           "link" : "/de/beliebte-projekte/bundle1" 
 
          }, 
 
          { 
 
           "title" : "Bundle2", 
 
           "link" : "/de/beliebte-projekte/bundle2" 
 
          } 
 
         ] 
 
        } 
 
       ], 
 
       "sign_in"  : "Login" 
 
      } 
 
     }, 
 
     { 
 
      "lang" : "en", 
 
      "lines" : { 
 
       "menu" : [ 
 
        { 
 
         "title": "How it works", 
 
         "link": "/en/how-it-works", 
 
         "children" : [] 
 
        }, 
 
        { 
 
         "title": "Popular Projects", 
 
         "link": "/en/popular-projects", 
 
         "children" : [ 
 
          { 
 
           "title" : "Bundle1", 
 
           "link" : "/en/popular-projects/bundle1" 
 
          }, 
 
          { 
 
           "title" : "Bundle2", 
 
           "link" : "/en/popular-projects/bundle2" 
 
          } 
 
         ] 
 
        } 
 
       ], 
 
       "sign_in"  : "Sign in" 
 
      } 
 
     } 
 
    ] 
 
}; 
 
var en = obj.langs[1].lines.menu; 
 
var de = obj.langs[0].lines.menu; 
 

 
function GetUrl(enUrl, enMenu, deMenu) 
 
{ 
 
    var deUrl; 
 
    for(var i = 0; i < enMenu.length; i++) 
 
    { 
 
    \t if(enMenu[i].link == enUrl) 
 
    { 
 
    \t deUrl = deMenu[i].link; 
 
     break; 
 
    } 
 
    else 
 
    { 
 
    \t if(enMenu[i].children && enMenu[i].children.length > 0) 
 
     { 
 
     \t deUrl = GetUrl(enUrl,enMenu[i].children, deMenu[i].children) 
 
     } 
 
    } 
 
    } 
 
    
 
    return deUrl; 
 
} 
 

 
console.log(GetUrl("/en/how-it-works", en, de)); 
 
console.log(GetUrl("/en/popular-projects", en, de)); 
 
console.log(GetUrl("/en/popular-projects/bundle1", en, de)); 
 
console.log(GetUrl("/en/popular-projects/bundle2", en, de));