Questions tagged [react-table]

React Table is a lightweight, fast and extendable datagrid built for React.

Tanstack table for react

Headless UI for building powerful tables & datagrids.

Supercharge your tables or build a datagrid from scratch while retaining 100% control over markup and styles.

Features

  • Lightweight (10 - 15kb)
  • Tree-Shaking
  • Headless
  • Cell Formatters
  • Auto-managed internal state
  • Opt-in fully controlled state
  • Sorting
  • Multi Sort
  • Global Filters
  • Columns Filters
  • Pagination
  • Row Grouping
  • Aggregation
  • Row Selection
  • Row Expansion
  • Column Ordering
  • Column Visibility
  • Column Resizing
  • Virtualizable
  • Server-side/external Data
  • Nested/Grouped Headers
  • Footers

Resources

1381 questions
-1
votes
2 answers

I have a function in react that I need to pass data to, how do I pass the parameter?

Somewhat new to reactjs. Using Visual Studio Code to build my UI, in reactjs. I need to pass my data to Application, is this done on this line? I know how to pass data to other components, but now sure how it is passed to a…
jamesT
  • 113
  • 8
-1
votes
1 answer

Mulitple condition filter on row and apply color React Table

I am using react-table to show data. In that I want to use multiple condition on table row and color as below: const WORK_ORDER_COLUMNS = [{ Header: 'ID', accessor: 'id', width: 50 }, { Header: 'Product', accessor: 'product', …
Damini Suthar
  • 1,470
  • 2
  • 14
  • 43
-1
votes
2 answers

How to dynamically create a multilevel object from a dot notation string

I have some data that i need to format. The input is something like const data = [ ['0','some name','ok'], ['0.1','some name','ok'], ['0.1.01','some name', 'ok'], ['0.1.01.01','some name','ok'], …
Aventris
  • 1
  • 2
-1
votes
1 answer

javascript-es6: unable to destructure an array of objects. UNEXPECTED TOKEN ERROR

I have an array of objects and I am trying to destructure it so that I can directly use the property names in react-table's column's accessor property. This is the raw JSON which is actually being fetched via an API call. Not sure, where I am going…
Nauman
  • 894
  • 4
  • 14
  • 45
-1
votes
1 answer

React and tables

I want to display the data returned from an api in a tabular form.What is preferable: Building a table from scratch and adding functionality like pagination, search and row select or Using already built in components like react-table or…
sk215
  • 119
  • 1
  • 15
-1
votes
3 answers

Passing data to a react map function

Im having a little trouble passing data to a map function and im not sure where im going wrong. Im getting all the users when the component mounts, but after i get the users im trying to add a const. This all works, but then in the constructor when…
CodeSauce
  • 255
  • 3
  • 19
  • 39
-1
votes
1 answer

How do we add a text in React table pagination component?

basically i need to add another text at the end . ie. , Page 1 of 2 recordds I tried this property nextText={"nextpage"}, but does not work,Thoughts ?
Parameswar
  • 1,951
  • 9
  • 34
  • 57
-1
votes
2 answers

How to provide an option to choose number of records in a page - react table?

Using react table for displaying data, How can i provide an option for the user to choose number of rows displayed ? Something like : Thanks in advance,
Parameswar
  • 1,951
  • 9
  • 34
  • 57
-1
votes
1 answer

show certain column for user type

After login I store user type in the local storage. There are types of users who should see last column of react table. I'm having problem in implementing this.
-1
votes
2 answers

React cannot update state twice

Guys I am new to React and I am having problems to update the State twice in a single call. I am trying to filter the visible rows on a React Table based on their Gender. Below is my State with data that is filtered and updated and a backup…
TwoThumbSticks
  • 1,086
  • 3
  • 23
  • 38
-1
votes
2 answers

How to eliminate duplicate values in dropdown of a React Table - ReactJS/JavaScript

I am trying to learn multi filter with React Table. Here is my Demo/Fiddle I am trying to eliminate duplicate values in dropdown of my React Table