Why is Formik error output not working?

Question

React

The first time I decided to use formik + yup. I insert the ErrorMessage tag and get:

Cannot read property 'touched' of undefined

33 | render() {
  34 |   let { component, formik, render, children, name, ...rest } = this.props;
  35 | 
> 36 |   const touch = getIn(formik.touched, name);
     | ^  37 |   const error = getIn(formik.errors, name);
  38 | 
  39 |   return !!touch && !!error

Component.jsx

import React from 'react';
import FormControl from '@material-ui/core/FormControl';
import {Button, Grid, TextField} from "@material-ui/core";
import useStyles from "./Auth.style";
import {ErrorMessage, useFormik} from "formik";
import * as Yup from 'yup'


const Register = () => {
    const classes = useStyles();
    const validate = Yup.object({
        name: Yup.string(),
        email: Yup.string().email('Email is wrong').required('Req'),
        password: Yup.string().min(6, 'Не меньше 6 символов').required('Req'),
        confirm: Yup.string().oneOf([Yup.ref('password'), null], 'Пароль не совпадает').required('Req')
    })

    const formik = useFormik({
        initialValues: {
            name: '',
            email: '',
            password: '',
            confirm: ''
        },
        onSubmit: values => {
            alert(JSON.stringify(values, null, 2));
        },
        validationSchema: validate
    })

    return (
        <Grid container justify='center' alignItems='center' className={classes.root}>
            <form onSubmit={formik.handleSubmit}>
                <Grid className={classes.grid}>
                    <h1 className={classes.header}>Registration</h1>
                    <Grid item>
                        <FormControl variant="outlined" className={classes.control}>
                            <TextField
                                autoComplete='false'
                                tabIndex='0'
                                name='name'
                                type='text'
                                variant="outlined"
                                id="outlined-basic"
                                label='Name'
                                value={formik.values.name}
                                onChange={formik.handleChange('name')}
                            />
                        </FormControl>
                    </Grid>
                    <Grid item>
                        <FormControl variant="outlined" className={classes.control}>
                            <TextField
                                required
                                tabIndex='1'
                                name='email'
                                type='email'
                                variant="outlined"
                                id="outlined-basic"
                                label='Email'
                                value={formik.values.email}
                                onChange={formik.handleChange('email')}
                            />
                            <ErrorMessage name='email' />
                        </FormControl>
                    </Grid>
                    <Grid item>
                        <FormControl variant="outlined" className={classes.control}>
                            <TextField
                                required
                                tabIndex='2'
                                name='password'
                                type='password'
                                variant="outlined"
                                id="outlined-basic"
                                label='Password'
                                value={formik.values.password}
                                onChange={formik.handleChange('password')}
                            />
                        </FormControl>
                    </Grid>
                    <Grid item>
                        <FormControl variant="outlined" className={classes.control}>
                            <TextField
                                required
                                tabIndex='3'
                                name='confirm'
                                type='password'
                                variant="outlined"
                                id="outlined-basic"
                                label='Confirm Password'
                                value={formik.values.confirm}
                                onChange={formik.handleChange('confirm')}
                                 />
                        </FormControl>
                    </Grid>
                    <Grid item>
                        <Button type='submit' variant="contained" className={classes.submit} >
                            Register
                        </Button>
                    </Grid>
                </Grid>
            </form>
        </Grid>
    );
};

export default Register;