Material UI DatePicker 设置为必需

Question

我在我的 React 应用程序中使用 Material UI DatePicker，需要设置所需的日期？

我是否需要创建一个自定义验证器来检查提交时的值，或者是否有一个道具可以用来将字段设置为必填？

<DatePicker
            spacing={2}
            PopoverProps={{ container: this.props.container }}
            onChange={this.updateEndDate}
            value={this.state.endDate}
            initialFocusedDate={this.state.startDate}
            minDate={this.state.startDate}
            disablePast="true"
            disableToolbar="true"
            variant="inline"
            label="End Date"

           // I have tried adding required, required="true", required={true}


          />

Answer 1

您可以通过为文本字段添加 slotProps 属性来在 DatePicker 中设置 required （您可以在 datepicker 的 mui 组件 API 部分中阅读更多相关信息）：

<DatePicker
        spacing={2}
        PopoverProps={{ container: this.props.container }}
        onChange={this.updateEndDate}
        value={this.state.endDate}
        initialFocusedDate={this.state.startDate}
        minDate={this.state.startDate}
        disablePast="true"
        disableToolbar="true"
        variant="inline"
        label="End Date"

       // I have tried adding required, required="true", required={true}

        slotProps={{
              textField: {
                required: true,
              },
            }}
      />

尽管它不会显示任何错误，但它会保留所需的属性。如果我找到一种方法将继承的所需对话框添加到其中，我将更新答案

Answer 2

requiredmaterial-ui/date-picker 上没有属性/prop。可以做的就是设置一个默认日期，比如今天。并处理错误/所需的标准onChange。