Element UI的 el-date-picker 做时间限制，选择第一个时间后的限制，当前日期的限制

Element U I的 el-date-picker做时间限制

1. 以当前日期为基础，往后的时间不可以选择。

2. 以选择的第一个日期为基础，前后只能选择7天（可以自己配置几天）。

   el-date-picker

<el-date-picker
        v-model="timeVal"
        @change="changeDataTime"
        type="daterange"
        :picker-options="pickerOptions"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期">
</el-date-picker>

第一种限制：以当前日期为基础，往后的时间不可以选择。

data(){
        return {
        	//给的默认时间
			timeVal: [new Date()- 3600 * 1000 * 24 * 3, new Date()],
			pickerOptions: {
				disabledDate(time) {
					// 这个是当前日期后的日期不可选
                     return time.getTime() > Date.now()
				}
			}
        }
      }

第二种限制：以选择的第一个日期为基础，前后只能选择7天（可以自己配置几天）。

data(){
			// 不写这一句  disabledDate中的pickerOneDate 会报undifine
            var that = this;
            return {
            	//给的默认时间
				timeVal: [new Date()- 3600 * 1000 * 24 * 3, new Date()],
				// 用于已选择的第一个时间
                pickerOneDate: new Date()- 3600 * 1000 * 24 * 3,
              
                pickerOptions: {
                    // 获取选择的第一个时间
                    onPick: (obj) => {
                    	// 把第一个时间分配给pickerOneDate 
                        let startDate = new Date(obj.minDate).getTime();;
                        that.pickerOneDate = startDate;
                    },
                    disabledDate(time) { 
                        if (that.pickerOneDate) {
                          // 自己配置选择几天，我这是6天
                            const day = 6 * 24 * 3600 * 1000
                            let maxTime = that.pickerOneDate + day
                            let minTime = that.pickerOneDate - day
                            return time.getTime() > maxTime || time.getTime() < minTime || time.getTime() > Date.now()
                        } else {
                        	// 这个是当前日期后的日期不可选，没有这个需求可删掉
                            return time.getTime() > Date.now()
                        }
                    },
                },
	}
}