elementui日期选择器限制日期范围

elementui 日期选择器设置日期范围的几种常见方法。

禁用今天之后日期

禁止日期选择器选择今天之后的日期。

disabledDate:(time)=>{
    return time.getTime() > new Date()
}

只允许选择30天内的日期

只能适用于日期范围的选择。这个30天有两种方式，第一种是今天的日期往前推30天内（也就是最近30天），第二种是选择了第一个日期之后的前/后30天内。

第一种：选择最近30天内的日期

disabledDate:(time)=>{
    var t = time.getTime() 	//选择的时间戳
    var d = 30*24*60*60*1000 //30天的时间戳
    var cur = new Date().getTime() //当前时间戳
    //选择的时间戳 < 30天前的时间戳 || 选择的时间戳 > 当前时间
    return t < (cur - d) || t > cur
},

第二种：选择第一个日期之后的前/后30天内，并且禁止选择超过今天的日期。

options:{
    disabledDate:(time)=>{
        var t = time.getTime() //
        var d = 30*24*60*60*1000 //30天时间戳
        var cur = new Date().getTime() //当前时间戳
        //禁止选择超过前后30天的日期
        if(this.curr_minDate !== '') {
            var maxdate = this.curr_minDate + d
            var mindate = this.curr_minDate - d
            return t < mindate || t > maxdate
        }
        //禁止选择今天之后的日期
        return t > cur
    },
    onPick:({maxDate, minDate})=>{
        this.curr_minDate = minDate.getTime()
        if(maxDate) this.curr_minDate = ''
    }
}

在options里需要使用箭头函数才可以获取当前this对象的data数据。

只允许选择最近7天内日期

disabledDate:(time)=>{
    var t = time.getTime() 
    var d = 7*24*60*60*1000
    var cur = new Date().getTime() //当前时间戳
    //选择时间戳》当前时间戳 || 选择时间戳《（当前时间戳 - 7天的时间戳）
    return t > cur || t<(cur-d)
},

如果需要在选择第一个日期之后禁止日期范围，可以使用上面只允许选择30天内的日期的第二种例子，只需要修改一下对应的允许日期的戳就行了。

只允许选择本月内日期

disabledDate:(time)=>{
    var select_month = time.getMonth()
    var month = new Date().getMonth()
    return select_month != month
}

只允许选择今年内日期

disabledDate:(time)=>{
    var select_year = time.getFullYear() //选择的年份
    var year = new Date().getFullYear() //当前的年份
    return select_year != year  
}

如果今天的刚好是今天的第一天，如果想选择去年的日期，可以在前面加上条件，例如：

disabledDate:(time)=>{
    var select_year = time.getFullYear()
    var d = new Date()
    var year = d.getFullYear()
    var month = d.getMonth()+1
    var date = d.getDate()
    var cur_date =year+''+month + '' +date
    //如果今天是今年的第一天
    var f_year = cur_date == year+'11' ? (year-1) : year
    return select_year < f_year || select_year > year
}