React js嵌套循环数组

Question

[嗨，我需要nelp跟随json数组循环。它喜欢instagram或facebook帖子。我有一个json嵌套数组。但我无法通过视图渲染。我尝试了很多技术，但并没有帮助我。我需要像Instagram帖子一样的视图。

我想通过循环分别获取个人资料，赞，评论，帖子详细信息

render() {
  var Json={
     "AllPost": [{
        "Records1": [{
           "Profile": {
              "User_Id": "1",
              "UserImage": "",
              "Fullname": "Test",
              "Username": "te"
           },
           "Post": {
              "Post_Id": "1",
              "UploadFile": "",
              "Post_Caption": "Test",
              "User_Id": "1"
           },
           "likedetails": {
              "Post_Id": "1",
              "LikeCount": "345"
           },
           "commentdetails": [{
              "Comments": "testA",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testB",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testC",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testD",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testE",
              "Comment_Date": "12-12-12"
           }]
        }],
        "Records2": [{
           "Profile": {
              "User_Id": "1",
              "UserImage": "",
              "Fullname": "Test",
              "Username": "te"
           },
           "Post": {
              "Post_Id": "2",
              "UploadFile": "",
              "Post_Caption": "Test",
              "User_Id": "2"
           },
           "likedetails": {
              "Post_Id": "12",
              "LikeCount": "3452"
           },
           "commentdetails": [{
              "Comments": "testA",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testB",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testC",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testD",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testE",
              "Comment_Date": "12-12-12"
           }]
        }],
        "Records3": [{
           "Profile": {
              "User_Id": "3",
              "UserImage": "",
              "Fullname": "Test3",
              "Username": "te3"
           },
           "Post": {
              "Post_Id": "3",
              "UploadFile": "",
              "Post_Caption": "Test",
              "User_Id": "3"
           },
           "likedetails": {
              "Post_Id": "3",
              "LikeCount": "345"
           },
           "commentdetails": [{
              "Comments": "testA",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testB",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testC",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testD",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testE",
              "Comment_Date": "12-12-12"
           }]
        }],
        "Records4": [{
           "Profile": {
              "User_Id": "4",
              "UserImage": "",
              "Fullname": "Test4",
              "Username": "te4"
           },
           "Post": {
              "Post_Id": "4",
              "UploadFile": "",
              "Post_Caption": "Test4",
              "User_Id": "4"
           },
           "likedetails": {
              "Post_Id": "4",
              "LikeCount": "3454"
           },
           "commentdetails": [{
              "Comments": "testA",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testB",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testC",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testD",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testE",
              "Comment_Date": "12-12-12"
           }]
        }],
        "Records5": [{
           "Profile": {
              "User_Id": "5",
              "UserImage": "",
              "Fullname": "Test5",
              "Username": "te5"
           },
           "Post": {
              "Post_Id": "5",
              "UploadFile": "",
              "Post_Caption": "Test5",
              "User_Id": "5"
           },
           "likedetails": {
              "Post_Id": "5",
              "LikeCount": "3455"
           },
           "commentdetails": [{
              "Comments": "testA",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testB",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testC",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testD",
              "Comment_Date": "12-12-12"
           }, {
              "Comments": "testE",
              "Comment_Date": "12-12-12"
           }]
        }]
     }]
  }

让arr = [];

 Object.keys(Json.AllPost).forEach(function(record,key) { 



     Json.AllPost.forEach((obj, idx) => {
        console.log(obj)
           Object.values(obj).forEach(function(records,key) {  
             // console.log(records)
              Object.values(records).forEach(function(records1,key) { 
             //  console.log(records1)
              // arr.push(records1)
               console.log(arr)
               Object.values(records1.Profile).forEach(function(records2,key) { 
                 arr.push(records2)
                 console.log(arr)
                 })
           });  
       });   

      });
    });

Answer 1

您的意思是这样的吗？这里的链接卡视图=> http://borz.surge.sh/

const BASE_URL = 'https://www.instagram.com/'userName'/?__a=1';
    Axios.get(BASE_URL)
        .then((res) => {
            console.log(res.data.graphql.user.edge_owner_to_timeline_media.edges[0].node.edge_media_to_caption.edges[0].node)
            this.setState({d: res.data.graphql.user.edge_owner_to_timeline_media.edges})
        });