ant-design-vue ui 日期选择器(二)添加页面中使用——初始时空白,回显时间

在添加页面中使用时间日期选择器,需要初始时时间为空,编辑回显时间。(下面的是只能选择当前日期之后的时间)

<a-date-picker
  :default-value="upTime ? moment(upTime, 'YYYY-MM-DD HH:mm:ss') : null"
  format="YYYY-MM-DD HH:mm:ss"
  :disabled-date="disabledDate"
  :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
  @change="okUpTime"
/>
data() {
  return {
    upTime: ''
  }
},
methods: {
  moment,
  disabledDate(current) {
    // Can not select days before today and today
    return current > moment().endOf('day');
  },
  getzf(num) {
    if (parseInt(num) < 10) {
      num = '0' + num;
    }
    return num;
  },
  okUpTime(dates) {
    let date = new Date(dates);
    let y = date.getFullYear();
    let M = date.getMonth() + 1;
    let d = date.getDate();
    let h = date.getHours();
    let m = date.getMinutes();
    let s = date.getSeconds();
    let theDay = `${y.toString()}-${M.toString()}-${d.toString()} ${this.getzf(h).toString()}:${this.getzf(m).toString()}:${this.getzf(s).toString()}`;
    this.upTime = theDay;
    return theDay;
  },
}

 

posted @ 2021-10-13 10:49  圆圆呀~  阅读(742)  评论(0编辑  收藏  举报