mint-ui的时间选择器 Datetime picker

  起运时间
  
选择

// 时间选择器初始化时间
timeValue: '',

open (picker) {
      // 初始化时间为当前时间，可填满上部空白，可选过期时间
     if (this.insurInformation.startTime) {
        this.timeValue = this.insurInformation.startTime
      } else {
        this.timeValue = new Date()
      }
      this.$refs[picker].open()
    },

    handleChange (value) {
      // 转化为正常时间格式
      this.insurInformation.startTime = this.$moment(value).format('YYYY-MM-DD HH:mm:ss')
      // 将时间格式转化为时间戳
      let  timedata = this.$moment(value, 'YYYY-MM-DD HH:mm:ss').valueOf()
    },

使用成功后的效果图：组件上部是空白的，不好看，而且初始时间也有问题

图片.png

修改后：填满了上部空白，但是，可选到过期时间

图片.png

修改后：使用组件的startDate或者endDate属性，可以限制可选时间范围，但是上部空白会出现

图片.png

注意：

1. Datetime picker不仅有确认按钮的回调函数confirm，也有取消按钮的回调函数cancel，但是官方文档中没有明确指出，取消按钮的回调函数可用于清空时间选择的input表单。
2. Datetime picker选择到的值为 “Thu Aug 01 2019 09:47:39 GMT+0800 (中国标准时间)”，使用 moment.js进行时间格式化是最简单的，当心，如果后台要求提交时间戳，记得转换 this.$moment(value, 'YYYY-MM-DD HH:mm:ss').valueOf()。