title: React changing array label names on map output
body: <p>I have a React component which is access JSON data for populate a tree component. The tree is showing nodes and ports. Here is a sample from the JSON:</p>
  
  <pre><code>"outputs": {
          "graph": {
              "nodes":[ {
                  "name":"nlabme3400",
                  "ports":[ {
                      "name": "GigabitEthernet 0/2", "id": "5bd350c7-d15b-4f8b-be70-18eda2bfe41a"
                  }
                  ,
                  {
                      "name": "FastEthernet 0/19", "id": "5bd350c7-762d-4462-984b-e6f0a9edb6c7"
                  }
                  ,
                  {
                      "name": "FastEthernet 0/21", "id": "5bd350c7-2927-43db-ae43-119b12636de6"
                  }
   ],
                  "id":"5bd350bf-8515-4dc2-9b12-16b221505593"
              }
  </code></pre>
  
  <p>I have all of this information coming in to my component via the following axios get call:</p>
  
  <pre><code>  axios.get('StepThreeFinalData.json').then(response =&gt; {
             const nodess = response.data.outputs.graph.nodes.map(({id, name, 
  ...children}) =&gt; ({value: id, label: name, children: children.ports}));
  </code></pre>
  
  <p>The output is working perfectly. However, the challenge is that I need to change the "name" and "id" tags in the children array to "label" and "value", respectively, because otherwise the label will not show up in the tree component. Not sure how to do this. Please help! </p>