React Material-UI Cookbook

How to do it...

Let's say that you have a date picker and a time picker on a screen in your app. You want the date field to default to the current date and the time field to default to the current time. To do this, it's best to rely on the Date instances to set the initial Date/Time value. However, a little work is involved, since you can't natively pass the Date instances to the TextField components. Here's an example that shows how this can work:

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.unit }}));function formatDate(date) { const year = date.getFullYear(); ...