Vue element-ui date-picker 結束時間大於開始時間且開始時間小於此刻(轉)

轉載自：https://blog.csdn.net/wintersweetGirl/article/details/82461412

<el-form ref="form" :model="sizeForm" label-width="100px" size="mini">
    <el-form-item label="開始時間">
        <el-date-picker type="datetime" placeholder="開始日期" :picker-options="startTime" v-model="sizeForm.startTime" style="width: 90%;"></el-date-picker>
    </el-form-item>
    <el-form-item label="結束時間">
        <el-date-picker type="datetime" placeholder="結束日期" :picker-options="endTime" v-model="sizeForm.endTime" style="width: 90%;"></el-date-picker>
    </el-form-item> 
<el-form>       

 

export default{
  data () {
    return {
      sizeForm: {
        startTime: '',
        endTime: ''
      },
// 開始時間小於結束時間，且開始時間小於此刻
      startTime: {
        disabledDate: time => {
          if (this.sizeForm.endTime) {
            return time.getTime() > new Date(this.sizeForm.endTime).getTime()
          } else {
            return time.getTime() > Date.now()
          }
        }
      },
// 結束時間大於開始時間，且小於此刻
      endTime: {
        disabledDate: time => {
          if (this.sizeForm.startTime) {
            return time.getTime() > Date.now() || time.getTime() < new Date(this.sizeForm.startTime).getTime()
          } else {
            return time.getTime() > Date.now()
          }
        }
      }
    }
  }
}