您的位置:首页 > Web前端 > Vue.js

antDesignVue 时间选择框,不可选过去或未来时间

2020-06-06 07:33 106 查看

antDesignVue 时间选择框

<a-date-picker
:disabledDate="disabledDate"
@ok="timeOk"
format="YYYY-MM-DDTHH"
:showTime="{ defaultValue: moment(moment().add(1,'hours').format('HH'), 'HH') }"
v-decorator="['stopTime',{
rules: [ { required: true,message: '请选择日期' } ]
}]" />
  1. 不可选过去或未来的时间
disabledDate (current) {
// 不可选过去时间
return current < moment().add(-1, 'd');
// 不可选未来时间
return current && current > Date.now();
},
  1. 表单中判断所选时间是否符合要求,若不符合清空所选时间并提示错误信息
timeOk (date) {
if(date < moment()) {
console.log('无效时间,请重新选择')
this.form.setFields({stopTime:{
value: undefined,
errors: [new Error('无效时间,请重新选择')]
}})
}
},
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: