el-date-picker 如何设置pickerOption选中日期范围

一狐九

于 2024-01-19 14:23:59 发布

阅读量486

点赞数 10

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/zz_LXW/article/details/135697026

版权

文章详细描述了如何在JavaScript中使用letepickerOption配置日期时间选择器，包括disabledDate函数处理日期限制以及onPick事件处理选择范围。着重于IT技术中的日期选择组件实现和逻辑控制。

摘要由CSDN通过智能技术生成

data() {
   let pickerOption=()=>{
      let minTime = null
      let maxTime = null
      return {
        disabledDate: (time) => {
          if (minTime||maxTime) {
            return time.getTime() < minTime || 
            time.getTime() > maxTime
            //如果需要选中日期不超过当天就加上
            //|| time.getTime() > Date.now()
          } else if (time.getTime() > Date.now()) {
            return true
          }
        },
        onPick(time) {
          if (time.maxDate && time.minDate) {
            minTime = null
            maxTime = null
          } else if (!time.maxDate|| !time.minDate) {
            minTime = time.minDate.getTime() - 31536000000
            maxTime = time.minDate.getTime() + 31536000000
          } else {
            // 放开限制，方便再次选择
            minTime = null
            maxTime = null
          }
        },
      }
    }
   return{
   		pickerOption:pickerOption()
	}
}