Displaying nested objects from JSON response

Question

This may be a simple fix but I'm new to react so I appologize in advance. I have nested data that I would like to display on a list. The data is being pulled and displayed below.

data: [
{
  "id": 1,
  "domain_url": "localhost",
  "created_on": "2020-05-26",
  "config": [
    {
      "test_name": "test",
      "test_description": "test",
    }
  ]
}
]

I can get the domain_url and created_on displaying just fine but nothing I've tried gets any of the config items to appear.

below is the current method I'm using.

<tbody>
  {this.props.data.map((data) => (
  <tr key={data.id}>
    <td>{data.domain_url}</td>
    <td>
      {data.config.map((sub) => {
        sub.test_name;
      })}
    </td>
    <td>{data.created_on}</td>
    <td>
    ...

how can I get the test name from the config array to display? Any help would be appreciated. Thank you!

Your data.config.map() is not returning anything. Change the line to return sub.test_name; — terrymorse
– terrymorse, Commented May 27, 2020 at 18:54
thank you, I was unaware that I needed to return it very new to this. This solved it. — Ebolasudan
– Ebolasudan, Commented May 27, 2020 at 19:20
You can alternately eliminate the surrounding {}, like this: data.config.map((sub) => sub.test_name). That does an implicit return of sub.test_name. — terrymorse
– terrymorse, Commented May 27, 2020 at 19:26

Lim Jing Rong · Accepted Answer · 2020-05-27 18:56:13Z

1

Your code looks right - I think you just need to add a ‘return’ in front of your ‘sub.test_name;’

answered May 27, 2020 at 18:56

Lim Jing Rong

4262 silver badges4 bronze badges

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

Collectives™ on Stack Overflow

Displaying nested objects from JSON response

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