CODEWITHSUNDEEP
javascripthtmlcssreactjs
Swapnil Chaturvedi
Swapnil Chaturvedi

Reputation: 97

I want to create a meshed table like structure in react

I am creating a page where I need to show a table having rows and columns like structure and also need to add numbers inside the cells in the table. It has width and height also for the designing perspective.

But I have no idea how to implement the structure in react.

I am adding a prototype of what I have to create in my project.

Table image

What should be the best way to implement this so that I can able to show the colors and numbers.

Upvotes: 0

Views: 122

Answers (1)

Dmitriy Zhiganov
Dmitriy Zhiganov

Reputation: 1128

You can use a table

const rows = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]

<table>
  {rows.map(cells => {
    return (
      <tr>
        {cells.map(cellData => <td>{cellData}</td>)}
      </tr>
     );
  })}
</table>

Or use divs, if you don't need a table.

Upvotes: 1

Related Questions