how to return two maps value inside return function - react js

Question

this is my json response:

[
    [
        {
            "id": "12687",
            "user": ".",
            "comment": "همه چیز خیلی خوب بود.",
            "isadmin": false,
            "answer": [
                [
                    {
                        "id": "12692",
                        "user": "admin",
                        "comment": "سلام دوست عزیز. با تشکر از نظر شما",
                        "isadmin": true,
                        "answer": []
                    }
                ],
                [
                    {
                        "id": "12724",
                        "user": ".",
                        "comment": "تشکر",
                        "isadmin": false,
                        "answer": []
                    }
                ]
            ]
        }
    ],
    [
        {
            "id": "12688",
            "user": "fatehi",
            "comment": "طعم برگر ها بسیار متفاوت و خوشمزه بود، واقعآ لذت بردم.",
            "isadmin": false,
            "answer": [
                [
                    {
                        "id": "12691",
                        "user": "admin",
                        "comment": "همیشه پیروز و شاد باشید. با تشکر از نظر شما",
                        "isadmin": true,
                        "answer": []
                    }
                ]
            ]
        }
    ],
    [
        {
            "id": "12689",
            "user": "mahaki",
            "comment": "20 دقیقه ای طول کشید تا غذاهامون حاضر بشه اونم بخاطر این بود که خیلی شلوغ بود واگرنه بقیه چیزاشون خیلی خوب بود.",
            "isadmin": false,
            "answer": [
                [
                    {
                        "id": "12690",
                        "user": "admin",
                        "comment": "سلام دوست عزیز. با تشکر از نظر شما",
                        "isadmin": true,
                        "answer": []
                    }
                ]
            ]
        }
    ],
    [
        {
            "id": "12693",
            "user": "پرنیان",
            "comment": "فقط برگرهای توی سینی 4نفره رنگی هستند؟ یا بقیه هم در صورت درخواست با نون رنگی آماده میکنید؟ در نوروز سرویس دهی دارید؟",
            "isadmin": false,
            "answer": [
                [
                    {
                        "id": "12696",
                        "user": "admin",
                        "comment": "بااحترام، دوست عزیز کلیه موارد مطرح شده با هماهنگی و رزرو قبلی امکان پذیر می باشد.",
                        "isadmin": true,
                        "answer": []
                    }
                ]
            ]
        }
    ],
    [
        {
            "id": "12694",
            "user": "پرنیان",
            "comment": "میشه با دوتا شادیاب 1 پک برگر سفارش داد؟",
            "isadmin": false,
            "answer": [
                [
                    {
                        "id": "12695",
                        "user": "admin",
                        "comment": "بااحترام، خیر دوست عزیز هر شادیاب ویژه یک سفارش میباشد.",
                        "isadmin": true,
                        "answer": []
                    }
                ]
            ]
        }
    ]
]

now I want to render this response with two components:

1.CommentRow
2.AnswerRow

this is my code:

return (
...
{
    this.state.comments.map(item => {
        return (
        <div>
            <CommentRow key={item[0].id} row={item[0]} />
            item[0].answer.map(answer => {
                <AnswerRow key={item[0].id} row={item[0]} />
            })
        </div>
    )
    })
}
)

but it prints the second component:

Soroush Chehresa · Accepted Answer · 2018-04-22 13:15:05Z

1

you should use any functions inside { }

return (
      <div>
          <CommentRow key={item[0].id} row={item[0]} />
             { 
               item[0].answer.map(() => <AnswerRow key={item[0].id} row={item[0]} /> )
             }
      </div>
)

edited Apr 22, 2018 at 13:15

answered Apr 22, 2018 at 12:54

Soroush Chehresa

5,7081 gold badge16 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to return two maps value inside return function - react js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related