Element-plus DatePicker 日期选择器【正则校验时间范围】

本文主要是介绍Element-plus DatePicker 日期选择器【正则校验时间范围】，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

效果图：

        

利用element-plus中的form表单验证完成效果。 

     <el-form-item label="检查计划截止日期：" prop="deadline"><el-date-pickerv-model="form.deadline"value-format="YYYY-MM-DD"style="width: 100%"type="date"placeholder="请选择"size="small"/></el-form-item>

 

 

let rule = ref({
deadline: [{type: "date",required: true,message: "请选择计划截止日期",trigger: "change",},{trigger: "change",validator: (rule, value, callback) => {const inputDate = new Date(value);const maxDate = new Date('2024-04-22');  //这里可以换成变量值if (inputDate <= maxDate) {callback();} else {callback(new Error("日期不能大于2024-03-18"));}},message: `≤任务的结束日期（2024-04-22）`,},],
})

这篇关于Element-plus DatePicker 日期选择器【正则校验时间范围】的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---