vue element 日期选择器 限制在三个月
由于curMonth会比实际月份小1, 故需加1 */start-placeholder="开始时间"end-placeholder="结束时间"/* 返回当月的天数 *//* 获取当前月份 */从当前时间往前推三个月。
·
从当前时间往前推三个月
不在时间内置灰
HTML
<el-form-item>
<el-date-picker
v-model="daterange"
value-format="yyyy-MM-dd"
type="daterange"
start-placeholder="开始时间"
end-placeholder="结束时间"
:picker-options="pickerOptions1"
clearable>
</el-date-picker>
v-model 绑定的是查询条件,也就是一个数组,所以才会有接下来的watch赋值
data中定义:
data:
pickerOptions1: {
disabledDate(time) {
let curDate = new Date().getTime()
let three = 90 * 24 * 3600 * 1000
let threeMonths = curDate - three
// eslint-disable-next-line no-unused-vars
var thatDay = time.getTime()
return time.getTime() > Date.now() || time.getTime() < threeMonths
},
},
pickerOptions2: {
disabledDate(time) {
let curDate = new Date().getTime()
var curD = new Date()
/* 获取当前月份 */
var curMonth = curD.getMonth()
/* 生成实际的月份: 由于curMonth会比实际月份小1, 故需加1 */
curD.setMonth(curMonth + 1)
/* 将日期设置为0, 这里为什么要这样设置, 我不知道原因, 这是从网上学来的 */
curD.setDate(0)
/* 返回当月的天数 */
var days = curD.getDate()
let three = days * 24 * 3600 * 1000
let threeMonths = curDate - three
return time.getTime() > Date.now() - 8.64e7 || time.getTime() < threeMonths
},
},
watch:
// 上传时间
daterange(val) {
this.dataForm.createDateScopeStart = val !== null ? val[0] : ''
this.dataForm.createDateScopeEnd = val !== null ? val[1] : ''
},
更多推荐
已为社区贡献2条内容
所有评论(0)