Material-UI TextField context dirty

Question

I'm trying to better understand how to check for dirtyness using material-ui's FormControl or TextField component. The documentation for TextField demo page states:

TextField is composed of smaller components (FormControl, InputLabel, Input, and FormHelperText) that you can leverage directly to significantly customize your form inputs.

... and on the TextField API docs it states:

The properties of the <FormControl /> component are also available.

... and later in the FormControl API docs it states:

Provides context such as dirty /focused/error/required for form inputs. Relying on the context provides high flexibilty and ensures that the state always stay consitent across the children of the FormControl. This context is used by the following components:

FormLabel FormHelperText Input InputLabel

---

But I don't see any documentation state exactly HOW to check for dirty using the TextField / FormControl.

Can anyone clarify? This is StackOverflow, so here is some code for the TextField I'm using:

<TextField
  id='email'
  label='Email'
  value={this.state.email}
  onChange={this.handleChange('email')}
  margin="normal"
  required
  fullWidth>
</TextField>

Answer 1

You can use Formik material-ui

Formik Material UI

Answer 2

TextField 组件的脏检查必须手动实现。

handleChange = (id) => (event) => { this.setState({isEmailDrity: true}); };