vue el使用日期元件限制開始 結束日期選擇範圍

2021-10-01 18:23:28 字數 494 閱讀 1163

記錄一下最近使用element ui中的datepicker,限制開始日期不能選擇結束日期之後的日期,同樣結束日期不能選擇開始日期之前的日期。

原理是利用datepicker的:picker-options實現。

標籤新增:picker-options屬性

return中新增變數

data() 

}

methods中新增具體方法

startdatefun() 

} }},enddatefun()

} }},

有兩個地方需要注意,乙個是時間格式如果是yyyymmdd,需要轉換成yyyy-mm-dd,因為new date()不接收yyyymmdd。另乙個是結束日期要減一天,即24 * 60 * 60 * 1000,不然開始和結束日期不能選擇同一天。

elementUI 選擇開始結束日期加限制

需求是開始結束日期不得大於當前時間,當開始日期發生變化時,結束日期不得小於開始日期且不得大於當前日期 el form item label 開始日期 el date picker size mini v model form.startdate value format yyyymmdd type ...

jedate限制開始日期不能大於結束日期

js部部分 jedate starttime endtime val return nowmaxdate 設定最大日期為當前日期 donefun function obj jedate endtime linkageenddate function linkageenddate istg start...

同時包含開始日期和結束日期的 日期元件

功能樣式參考 呼叫方法 如想只選年可修改 startview,maxviewmode,minviewmode 0 日,1月,2年 this.startview 0 元件預設顯示日 this.maxviewmode 2 元件最大顯示年 this.minviewmode 0 元件最小顯示日 this.f...