≡

React

React is one of the most commonly used libraries on the web. It is used to create UIs with components allowing very complex applications and sites to be constructed. We provide a <DataTable> component for full integration of DataTables in React based apps.

The documentation here details how to use this component, and how to make use of the DataTables concepts introduced in the other sections of this manual. They still apply and can be used to get the most out of DataTables.

If you are just starting out with DataTables in a React app, follow along with the quick-start guide to get you up and running in the minimum time possible. The other sections of the manual will delve into more detail about each area of the component.

React / DataTables manual

Quick Start: React

Interested in using DataTables in React? Keen to give it a go? Then you are in the right place! This section will get you up and running with DataTables in 60 seconds(ish)! Read more »

Usage guide

An overview on how to use DataTables in a React app, going into more detail than the quick-start guide, giving you a concrete understanding of how the component works and can be integrated into your own app. Read more »

Installation

To make use of DataTables in a React app, you need to install both the React component and DataTables itself. You can also install extensions to expand the capabilities of DataTables. This section details how to install and include DataTables in your React app. Read more »

DataTable

The <DataTable> component is the root of this package, and provides a way for the table options and data to be defined. You can also use it to specify the columns in child components. Read more »

Columns

When working with tables, you are going to need some columns! The easiest way to define them in the React component for DataTables is with the <Column> component that the package exports. Column components let you specify the data and options for each column in the table. Read more »

Data

Once you've got a DataTable displayed on your page, you are going to want to have it display some data - that's the whole point after all! Typically in the DataTables React component you will use Ajax or reactive data to populate the table. Read more »