React Material-UI Cookbook

How to do it...

Let's say that you have a component that fetches data from an API endpoint. When the data loads, you want to display the tabular data in a Material-UI Table component. Here's what the code looks like:

import React, { useState, useEffect } from 'react';import { makeStyles } from '@material-ui/styles';import Table from '@material-ui/core/Table';import TableBody from '@material-ui/core/TableBody';import TableCell from '@material-ui/core/TableCell';import TableHead from '@material-ui/core/TableHead';import TableRow from '@material-ui/core/TableRow';import Paper from '@material-ui/core/Paper';const fetchData = () =>  new Promise(resolve => {    const items = [      {        id: 1,        name: 'First Item',        created: new Date(),        high: 2935, low: 1924, ...