<el-date-picker type="daterange" v-model="dateRang" range-separtor="至" start-
placeholder="开始时间" end-placeholder="结束时间" :picker-options="pickerOptions">
</el-date-picker>
export default{
data () {
//不能在pickerOption通过this访问vue对象,因为this指向已经改变
let that = this
return{
dateRang: [new Date(), ''],
pickerOptions: {
disabledDate (time) {
let startyear = that.dateRang[0].getFullYear() - 1
let endYear = that.dateRang[0].getFullYear() + 1
let endDate = endYear + '-' + (that.dateRang[0].getMonth() + 1) + '-' +
that.dateRang[0].getDate()
let startDate = startyear + '-' + (that.dateRang[0].getMonth() + 1) + '-' +
that.dateRang[0].getDate()
let _endDate = new Date(endDate)
let _startDate = new Date(startDate)
//即大于开始时间小于结束时间
return time.getTime() > _endDate.getTime() || time.getTime() <
_startDate.getTime()
},
onPick ({minDate, maxDate}) {
//重新设置开始时间
that.dateRang[0] = minDate
console.log(minDate)
}
}
}
}
}
希望对大家有所帮助