What’s new in React Table v7?
What’s new in React Table v7? 관련
It’s widely acknowledged that creating a table with React is a pain. No surprise, then, that there are many libraries to make creating tables easier for React apps. One of these packages is react-table. It provides a modern, Hooks-based API to let us create tables in React with little hassle.
With the latest major release, React Table v7 (tannerlinsley/react-table), creator Tanner Linsley aimed to refactor the entire library to a UI-, style-, and markup-agnostic table building tool that uses Hooks exclusively.
In this tutorial, we’ll tell you all you need to know about the latest version of react-table (at the time of writing, the most recent release is React Table v7.6.3 (tannerlinsley/react-table)), outline the major changes and new features shipped with React Table v7, and see them in action with a basic example.
Introducing React Table v7
In March 2020, React Table creator Tanner Linsley released React Table v7 (tannerlinsley/react-table), which he described as “the culmination of over a years [sic] worth of work to refactor the entire library to a hooks-only UI/Style/Markup agnostic table building utility.”
React Table v7 is comprised of a collection of React Hooks and plugins designed to help you compose logical features of complex data grids into a single, performant, extensible, and unopinionated API, which is returned by the primary useTable hook.
As a headless utility, React Table v7 doesn’t render or supply data table UI elements out of the box. That means you’re responsible for rendering your own table markup using the state and callback of the hooks provided by React Table.
Conclusion
As we can see, react-table is capable of creating tables with lots of capabilities without having to create everything from scratch ourselves.
It provides us with a Hooks-based API to create tables, which is important since some devs would like to switch to using function components with Hooks now.
There are many more examples to showcase what react-table can do on its official GitHub repo (tannerlinsley/react-table). Some examples are simplified from the examples on their official website.