vue+element 對日期時間選取做限制及上傳時格式的判斷

首先，我們要說明下需求！

• 開始時間及結束時間默認爲三天前到今天
• 開始時間不能選取結束時間之後（結束時間同理）
• 上傳時間爲yyyy-MM-dd hh:mm:ss格式
• 其中一個需求是隻能選擇未來一個月的數據，代碼在下

注意： 當時間爲空時，不能設置爲yyyy-MM-dd hh:mm:ss格式

template：

<el-date-picker type="datetime" :picker-options="pickerOptions0" v-model="startDate" placeholder="開始時間"
        style="width: 195px" transfer></el-date-picker>
      <el-date-picker type="datetime" :picker-options="pickerOptions1" v-model="endDate" placeholder="結束時間"
        style="width: 195px" transfer></el-date-picker>

data中： 

        startDate: new Date(new Date() - 24 * 60 * 60 * 1000 * 3), //開始時間
        endDate: new Date(), //結束時間
        pickerOptions0: {
          disabledDate: (time) => {
            if (this.endDate) {
              return time.getTime() > this.endDate || time.getTime() > new Date()
            }

          }
        },
        pickerOptions1: {
          disabledDate: (time) => {
            if (this.startDate) {
              return time.getTime() < this.startDate || time.getTime() > new Date()
            }
          }
        },

上傳參數時（用了三元表達式）：

startDate: this.startDate == null ? '' : this.startDate.format("yyyy-MM-dd hh:mm:ss"),
endDate: this.endDate == null ? '' : this.endDate.format("yyyy-MM-dd hh:mm:ss"),

 上傳之前判斷只能選擇未來一個月的數據（此時開始時間已經定位今日，且不可選！）：

var datadiff = this.endDate - this.startDate;
if (this.startDate != null && this.endDate != null && datadiff > 24 * 60 * 60 * 1000 * 30){
   this.$message.error('當前查詢時間段大於1個月，請重新選擇！');
   return false
}