CODEWITHSUNDEEP
javascriptreactjsecmascript-6
user10044012
user10044012

Reputation:

Javascript / React list titles from object

I have some data in a react project and I need to display the titles in a list.

Here is the data:

   const data = [
    {
        "things":[
            {
                "id":"1",
                "subdata":{
                    "date":{
                        "exp":"2018-17-23"
                    },
                    "titles":[
                        {
                            "title":"title1"
                        },
                        {
                            "title":"title2"
                        }
                    ]
                }
            }
        ]
    }
 ]

How can I list the title values in a

loop?

Upvotes: 0

Views: 614

Answers (5)

philip_nunoo
philip_nunoo

Reputation: 938

Instead of pointing to individual indexes within the array, @kevin Porche, I think you should have a function automatically know the indexes and build your titles for you.

Here is a code sample that would build your titles even when you have a lot of items within data eg:

const data = [{things: []}, {things: []} ];


const data = [
    {
        "things": [
            {
                "id": "1",
                "subdata": {
                    "date": {
                        "exp": "2018-17-23"
                    },
                    "titles": [
                        {
                            "title": "title1"
                        },
                        {
                            "title": "title2"
                        }
                    ]
                }
            }
        ]
    }
]

const yourTitles = [];
data.map(({ things }) => {
    things.map(({ subdata: { titles } }) => {           
        titles.map(({ title }) => {
            yourTitles.push(title);
        });        
    })
});

console.log(yourTitles);

Upvotes: 0

colefner
colefner

Reputation: 1841

To get the titles in a new array, you could use .map

const allTitles = data[0].things[0].subdata.titles.map(title => title.title);

console.log(allTitles);

// outputs ["title1", "title2"]

Upvotes: 0

Ross Sheppard
Ross Sheppard

Reputation: 870

data[0].things[0].subdata.titles.forEach(obj => console.log(obj.title));

Upvotes: 0

Sergii Shvager
Sergii Shvager

Reputation: 1256

To iterate through titles of just first thing and log it:

data[0].things[0].subdata.titles.forEach(obj => {
  console.log(obj.title)
})

Upvotes: 1

Asaf Aviv
Asaf Aviv

Reputation: 11770

data[0].things.map(({ subdata }) => subdata.titles.map(({ title }) => console.log(title)))

Upvotes: 0

Related Questions