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));