davidkrdona davidkrdona - 1 year ago 96
Javascript Question

How can i iterate this json with map in React to render it

Im trying to iterate this JSON so i can make a table, but as there is many headers and many data how can i go through without doing this.

const BBDDCustomer = {
ui_labels: {
name: 'Name',
address: 'address',
postalCode: 'Postal Code',
city: 'City',
country: 'Country',
telephone: 'Telephone',
email: 'Email',
modified: 'Modified',
delete: 'Delete'

data: [
name: 'n1',
address: 'a1',
postalCode: 'PC 1',
city: 'c 1',
country: 'cou 1',
telephone: 'tel 1',
email: 'em 1'

I don't have to write like this:

<table striped bordered condensed hover responsive>

Answer Source

You need to enumerate properties in the order you want

const columns = ['name', 'address', ...];

and use map

<Table striped bordered condensed hover responsive>
             columns.map(column => (
              <th key={column}>{BBDDCustomer.ui_labels[column]}</th>
          BBDDCustomer.data.map((data, i) =>(
           <tr key={i}>
                 columns.map(column => (
                    <td key={column + i}>{data[column]}</td>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download