は、オブジェクトのオブジェクトを反応させるの - どのようにループに

Question

を通じて、私は、次のエンコードされたJSONを持って次のようにデコードした後

const data = JSON.parse('{"first":{"aaa":"111","bbb":"2222"},"second":{"aaa":"111","bbb":"2222"}}') 

：

{ 
    "first": { 
    "aaa": "111", 
    "bbb": "2222" 
    }, 
    "second": { 
    "aaa": "111", 
    "bbb": "2222" 
    } 
} 

を、私は、その後に方法のいくつかの数を試してみましたこのデータをループではなく、期待どおりに動作を次のように

{Object.keys(data).map((key, value) => 
    console.log(key); 
    <li>{value.aaa}</li> 
)} 

私はデータをCONSOLE.LOG、それがループ見るが、私ことができますaaaまたはbbbの値を表示することはできません。

私はここで間違っていますか？これらのプロパティは、最初に計算する必要がありますので、我々はkeyとinnerKey周りのブラケットを使用する必要がある理由がある

{for (key in data) { 
    for (innerKey in data[key]) { 
     <li>{data[key][innerKey]}</li> 
    } 
}} 

：

THX アダム

Answer 1

はfor inループを使用してください。

Answer 2

値を保持する変数を割り当てることができます。キーを取得するには、以下の

var a = { 
    "first": { 
    "aaa": "111", 
    "bbb": "2222" 
}, 
"second": { 
"aaa": "111", 
"bbb": "2222" 
} 
} 

使用：

var keys = Object.keys(a); 

は、最後にそれを反復：

for(var i = 0; i < keys.length; i++) { 
    var key = (keys[i]) ; 
    console.log(a[key]) 
} 

Answer 3

マップ内の2番目のパラメータはの指標である

{Object.keys(data).map((key, index) => 
    <li key={index}>{data[key].aaa}</li> 
)}