React Material-UI Cookbook

How to do it...

Here's some code that renders a date picker text field for the user, and another text field that displays the date in another format as the date selection changes:

import React, { Fragment, useState } from 'react';import { makeStyles } from '@material-ui/styles';import TextField from '@material-ui/core/TextField';const useStyles = makeStyles(theme => ({  textField: { margin: theme.spacing(1) }}));export default function UsingDatePickers() {  const classes = useStyles();  const [date, setDate] = useState('');  const onChange = e => {    setDate(e.target.value);  };  const dateFormatted = date    ? new Date(`${date}T00:00:00`).toLocaleDateString()    : null;  return (    <Fragment>      <TextField        value={date}        onChange={onChange}        label="My Date" type="date" ...