如何在材质 UI 的日期字段中添加帮助文本？

Question

这是我的组件定义：

<DateField
      name={formElement.name}
      type="date"
      label={formElement.name}
      onChange={(date) => formik.setFieldValue(formElement.name, date)}
      value={formik.values[formElement.name] || null}
      onBlur={blurHandler}
      className={classes.flexGrow}
      // defaultValue={dataMatchHandler(formElement.name) || ''}
      minDate={doj}
      maxDate={Date('1/1/2023')}
      error={formik.touched[formElement.name] && Boolean(formik.errors[formElement.name])}
      helperText={formik.touched[formElement.name] && formik.errors[formElement.name]}
/>

现在当值更改为低于minDate错误触发正常，但我也想显示一个帮助文本，我该怎么做？

Answer 1

我的建议是您可以尝试使用 TextField，这样您就可以使用 helperText。

这是您可以尝试的示例：

 <TextField name={formElement.name} type="date" label={formElement.name} onChange={(date) => formik.setFieldValue(formElement.name, date)} value={formik.values[formElement.name] || null} onBlur={blurHandler} className={classes.flexGrow} helperText={formik.touched[formElement.name] && formik.errors[formElement.name]} />