文档： Ant Design Vue文档
设置不能选择今天之前的日期
（1）使用表单的formSchema中的componentProps组件属性通过disabledDate设置文章来源：https://www.toymoban.com/news/detail-686410.html
import dayjs, {Dayjs} from "dayjs";
{
label: '日期',
field: 'guidDate',
component: 'DatePicker',
dynamicRules: ({model, schema}) => {
return [
{required: true, message: '请输入日期!'},
];
},
componentProps: ({formModel}) => {
return {
format: 'YYYY-MM-DD',
disabledDate: (current: Dayjs) => {
return current && current < dayjs().add(-1, 'day').endOf('day');
},
}
}
},
（2）使用插槽slot方式实现文章来源地址https://www.toymoban.com/news/detail-686410.html
{
field: 'guidDate',
label: '起保日期',
slot: 'customSlot', //设置slot的值
component: 'DatePicker',
rules: [{required: true, message: '日期不能为空'}],
}
<BasicForm @register="registerForm" id="formLabel">
<template #customSlot="{ model, field }">
<a-date-picker v-model:value="model[field]" :disabled-date="disabledDate" :disabled-time="disabledDateTime" @change="dateChange"
format="YYYY-MM-DD HH:mm:ss" placeholder="日期"/>
</template>
</BasicForm>
/*开始时间*/
import dayjs, {Dayjs} from "dayjs";
const disabledDate = (current: Dayjs) => {
return current && current < dayjs().add(-1, 'day').endOf('day');
};
到了这里，关于jeecgboot vue3使用DatePicker组件设置可用日期的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
