ant design 时间选择控件

Posted on 2020-08-06 19:19  魏什么呀  阅读(1564)  评论(0编辑  收藏  举报
因为需求 使用两个时间控件作为开始和结束时 因为不是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)
          }
        }