菜单 学习猿地 - LMONKEY

VIP

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练!告别无效练习

接私单赚外块

VIP优先接,累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

入驻
227
0

ant design 时间选择控件

原创
05/13 14:22
阅读数 7373
因为需求 使用两个时间控件作为开始和结束时 因为不是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)
          }
        }

发表评论

0/200
227 点赞
0 评论
收藏