ant design 時間選擇控件

因為需求 使用兩個時間控件作為開始和結束時 因為不是range控件 所以沒辦法限制結束必須大於開始

這種就要自己加:disabled-date="disabledDate"方法

在結束時間控件上使用

<a-DatePicker placeholder="請選擇" value-format="yyyy-MM-dd"  @change="rangeTimeChange"  v-model="reportTimeStartString"/>
<a-DatePicker placeholder="請選擇" value-format="yyyy-MM-dd" :disabled-date="disabledDate"  @change="rangeTimeChangeEnd"   v-model="reportTimeEndString"/>

    // 限制時間不可選范圍

    disabledDate(current) {

      return current && current < moment(this.reportTimeStartString);

    },

 

<a-date-picker v-model="item.value" :defaultValue="item.value ? moment(item.value, 'YYYY-MM-DD') : ''" />

不輸入v-model 時間會默認選中那個值 一直無法修改 加了v-model 一直會有時間提示錯誤需要moment

所以想到在獲取item.value時候去moment一下 不管是默認值還是綁定值要記得加上非空判斷 不然空值回顯是一段字符

        // 時間的值要初始moment 不然報錯
        for(var i=0;i<this.sjwhList.length;i++){
          if(this.sjwhList[i].value){
            this.sjwhList[i].value = moment(this.sjwhList[i].value)
          }
        }