Question

我已经实现了KeyboardDateTimePicker。我无法针对empty或null值进行验证吗？我尝试了几件事进行验证，但仍无法正常工作。

代码：

<MuiPickersUtilsProvider utils={DateFnsUtils}>
    <KeyboardDateTimePicker
    required={true}
    format="dd/MM/yyyy HH:mm"
    value={this.props.StartDate}
    placeholder="dd/mm/yyyy hh:mm"
    onChange={(event) => this.props.handleDateTime(event)}
    />
</MuiPickersUtilsProvider>

我尝试将所需的validated = true放置在表单控件中，但无法正常工作。

在此处找不到任何关键字： https://material-ui-pickers.dev/api/KeyboardDatePicker

关于DateTimePicker： https://material-ui-pickers.dev/demo/datetime-picker

如果有人遇到类似问题，请提出建议。

Answer 1

添加道具error和helperText

您可以制作函数checkErrors=()=>this.props.StartDate?false:true并使用道具

error={checkErrors()}
helperText={checkErrors():"Some error message":""}

您的代码可能看起来像这样：

<MuiPickersUtilsProvider utils={DateFnsUtils}>
                    <KeyboardDateTimePicker
                      required={true}
                      format="dd/MM/yyyy HH:mm"
                      value={this.props.StartDate
                      }
                      placeholder="dd/mm/yyyy hh:mm"
                      onChange={(event) => this.props.handleDateTime(event)}
                      error={this.props.StartDate?false:true}
                      helperText={this.props.StartDate?"Some error message":""}
                    />
</MuiPickersUtilsProvider>

KeyboardDateTimePicker材质UI不是null验证

1 个答案: