React add label to nested array object in Object.keys map

Question

I have a React component which is pulling JSON data via an axios.get call and then I am mapping an embedded object using the following function:

axios.get('MasterData.json').then(response => {
       const fullTree = response.data.graph.tree;
       const resultTree = Object.keys(fullTree).map(key => ({
          ...fullTree[key],
         id: key
    }));

This produces the following:

{5bd356cc-5ee6-49a0-ab68-65cbf0209105: Array(6), id: "5bd356cc-5ee6-49a0- ab68-65cbf0209105"}

which is great, but I need to add a label of "ports: to the entire nested array (Array(6)) that is being output above so that I can map it. Any help is appreciated.

You can use ({ ports : ...fullTree[key], id: key }) instead of ({ ...fullTree[key], id: key }) — Hassan Imam
– Hassan Imam, Commented Nov 5, 2018 at 13:09
What do you mean by 'add a label'? Can you add details on how the structure is now and what your expected output is? — Dinesh Pandiyan
– Dinesh Pandiyan, Commented Nov 5, 2018 at 13:20
Hassan I get a parsing error with your method (my first thought was to try that). Dinesh, what I am trying to do is exactly what I thought Hassan's code would do, which is give the entire array a key of "ports." — CHays412
– CHays412, Commented Nov 5, 2018 at 13:56

Adi Nugraha · Accepted Answer · 2022-06-19 01:13:05Z

1

axios.get('MasterData.json').then(response => {
   const fullTree = response.data.graph.tree;  
   console.log(fullTree) // you must check this fist
   const resultTree = Object.keys(fullTree).map(key => 
     new Port({  // create some function to generate get port as you want
        port : fullTree[key],
        id: key
     )
});

for create function maybe on bellow me can explain more :)

edited Jun 19, 2022 at 1:13

answered Jun 16, 2022 at 1:56

Adi Nugraha

613 bronze badges

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

Collectives™ on Stack Overflow

React add label to nested array object in Object.keys map

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