element 的時間控件，有關v-model，:picker-options，@change

1、我直接用v-model="seachObj.beginTime"，選擇時間後選上了，但是傳給接口 看控制檯headers裏的form data的時候竟然沒有beginTime

解決方法是：@change="dateChangeBeginTime"

dateChangeBeginTime(val) {
        console.log(val);
let self = this;
self.seachObj.beginTime=val;

},

這樣就可以瞭解決form data的竟然沒有beginTime了

2、需求是

選開始時間後，結束時間必須必開始時間大；

這就用到:picker-options了

htlm

提出日期：<el-date-picker type="date" placeholder="選擇開始日期" v-model="seachObj.beginTime" style="width: 40%;" :picker-options="startDatePicker" @change="dateChangeBeginTime"></el-date-picker>

至<el-date-picker type="date" placeholder="選擇結束日期" v-model="seachObj.endTime" style="width: 40%;" :picker-options="endDatePicker" @change="dateChangeEndTime"></el-date-picker>

js

data(){

startDatePicker:this.beginDate(),
endDatePicker:this.processDate(),

}

methods:{

//提出開始時間必須小於今天
beginDate(){
let self = this
return {
disabledDate(time){
return time.getTime() > Date.now()//開始時間不選時，結束時間最大值小於等於當天
}
}
},
//提出結束時間必須大於提出開始時間
processDate(){
let self = this
return {
disabledDate(time){
if(self.seachObj.beginTime){
return new Date(self.seachObj.beginTime).getTime() > time.getTime()
}else{
return time.getTime() > Date.now()//開始時間不選時，結束時間最大值小於等於當天
}
}
}
}

}