Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Any plans to include table component ?

See original GitHub issue

if any, Is it going to be implemented from scratch or wrapper around something like react-table react-table

Issue Analytics

State:
Created 4 years ago
Reactions:74
Comments:35 (17 by maintainers)

Top GitHub Comments

84reactions

jeanverstercommented, Oct 8, 2019

Hi everyone, I have recently implemented a basic table using react-table v7 new headless API with chakra. Would be happy to make a PR if anyone would be interested in checking it out?

It’s pretty simple, usage would be as follows:

<Table columns={columns} data={data} />

And it looks like this:

Out the box it has client side sorting by column headers, single page navigation, updating number of rows visible, page count & navigating to the first / last page. In terms of responsiveness it adops the overflow-x approach so the user can scroll the table content.

Lemme know what you think!

33reactions

aaronmcadamcommented, Jun 16, 2020

Hi all, here’s my table implementation: https://codesandbox.io/s/upbeat-christian-3hbgp?file=/src/index.tsx.

Note that it doesn’t try to do anything fancy with data. It is mainly about the table styles.

If people are interested, I can add an example of using data to generate the table, but I’m following the standard React pattern of mapping over an array. I’m not using the object style of react-table to generate headings and rows.

Top Results From Across the Web

How to Create a Custom Table Component in React

The Table component takes in three props: theadData , tbodyData , and customClass . The customClass prop satisfies the last requirement from my ......

Using material-table in React to build feature-rich data tables

Let's review how to create tables in React using one of the best and most feature-rich libraries available: material-table.

Building a Data Table Component in React — Development

Start With a Basic React Data Table. First, create a basic data table component that receives as props an array of headings and...

Table Creator | Figma Community

Any changes made to the cells inside the template aren't updated because these have to be managed from the cell component itself (currently)....

Table Component | Tadabase

Like all other data components, table components can be added to a page within your app, specifically within a column on the page....