0

The Tables variable is an Object which contains and array of objects const Tables = {QD1:[{key:value, key:value, key:value, key:value}],QD1:[{key:value, key:value, key:value,key:value}]}

I'm trying ti construct a table based on the contents of it. However, when I run the following code, I only get one row when I am expecting to get a row for each object in the array. Can anyone tell me what I am doing wrong?

    render() {
const Tables = this.state.tableResult.Tables;
console.log(Tables);
if(typeof Tables !== 'undefined'){
  const display = Object.keys(Tables).map((bannerRowKey, bannerRowIndex) => {  
    let crossTab = Object.values(Tables[bannerRowKey]);
    console.log(crossTab);
    // if(bannerRowIndex===0){
    const TableRow = crossTab.map((crossTabRow,crossTabRowIndex)  => (
      // console.log(crossTabRowIndex);
      <tr key={'header'+crossTabRowIndex.toString()}></tr>
    ));
    return (
    <thead key={'header'+bannerRowIndex.toString()}>{TableRow}</thead>
    )

  })


  return <div id="table_holder" className="table-responsive mx-3">
  <table className="table-sm">
  {display}
  </table>
</div>
}else{
  return (
  <div id="table_holder" className="table-responsive mx-3">
    <table className="table-sm">
    </table>
  </div>
  );
}

}

Quantipy
  • 3
  • 2
  • In `TableRow` you aren't displaying anything. Add something like this inside the : `..{display value of crossTab}` – Son Nguyen Jun 21 '20 at 13:49
  • Although that did not solve the issue, it did help me debug it so that I can. Thanks for getting back to me. – Quantipy Jun 21 '20 at 16:06

1 Answers1

0

I realised that my map returned the key and value, so: QD1:[{key:value, key:value, key:value,key:value}] instead of just:[{key:value, key:value, key:value,key:value}].

Quantipy
  • 3
  • 2