element-ui使用心得之一：date-picker限制可选范围区间

el-date-picker中的picker-options属性用来控制不可选日期区域和今天、明天等快捷选择官方文档提供的demo中只有大于某个日期不可选我们发现disabledDate最后return了一个返回值，我们修改这个返回值来实现大于某个日期小于某个日期都不可选，也就是设定了可选范围 直接上代码：

HTML：

<el-date-picker v-model="beginTime" :type="dateType" :picker-options="pickerOptionsBegin" placeholder="开始日期"> </el-date-picker> <el-date-picker v-model="endTime" :type="dateType" :picker-options="pickerOptionsBegin" placeholder="结束日期"> </el-date-picker>

JS：

data () { return { timeStamp: 2 * 24 * 60 * 60 * 1000, // 2天转为毫秒的数值，这里尽量不要直接写算好的数字，可读性不高 beginTime: '', endTime: '' // 结束时间，常见需求是开始时间不大于结束时间 } }, computed: { this.pickerOptionsBegin: { disabledDate: time => { // time为形参，实参就是自动获取到的beginTime元素可以选的值 if (time && this.endTime) { // 注意：这里要把time.endTime以及你要计算的时间用.getTime()转为时间戳 // 大于结束时间不可选，小于结束时间减去两天（也就是昨天）不可选。结果是只能选昨天和今天 return time.getTime() > new Date(endTime).getTime() || time.getTime() < new Date(endTime).getTime() - timeStamp } } } }

如果有错误，请留言。有想看的内容请留言，我来写。谢谢