vue+elementUI 关于日期选择器的disabledDate问题
关于结束时间不能大于开始时间的问题,在elementui里我们用官方提供的disabledDate选项来解决。HTML:给选择器加上:picker-options属性//开始时间<el-date-picker v-model="startDate"></el-date-picker>//截止时间<el-date-picker v-model=...
·
关于结束时间不能大于开始时间的问题,在elementui里我们用官方提供的 disabledDate 选项来解决。
HTML:给选择器加上:picker-options属性
//开始时间
<el-date-picker v-model="startDate"></el-date-picker>
//截止时间
<el-date-picker v-model="endDate" :picker-options="endDateOpt"></el-date-picker>
DATA:
我这里就简略写下关键的。
data() {
return {
startDate: null,
endDate: null,
endDateOpt: {
disabledData: (time) => {
return time.getTime() < this.startDate;
}
}
}
}
以上是单个选择框的,如果是daterange或datetimerange的话:
<el-date-picker v-model="value1" type="daterange"
:picker-options="pickerOptions">
</el-date-picker>
data() {
return {
value: '',
pickerOptions2: {
disabledDate: (time) => {
return time.getTime() > new Date(2017, 11, 30) || time.getTime() < new Date(2017, 11, 11);//注意是||不是&&
}
}
};
}
问题: (html5)element UI 的datePicker 怎么限制输入的范围呢?
描述:
1.element UI的datePicker 怎么确定日期的选择范围内,向后台的数据需要限制在某一段日期范围内,在element Ui 的日期范围内
解决方案1:
pickerOptions0: {
disabledDate(time) {
return time.getTime() < Date.now() - 8.64e7;
}
},
disabledDate: (time) => {
let beginDateVal = this.addJobForm.beginDate;
if (beginDateVal) {
return time.getTime() < beginDateVal;
}
}
解决方案2:
http://element.eleme.io/#/zh-...
http://jsfiddle.net/api/post/...
设置picker-options的disabledDate,返回true被禁用。
涉及到具体的项目,这种问题最好到GitHub上去问。
更多推荐
已为社区贡献3条内容
所有评论(0)