Element DatePicker 日期选择器限定日期选择范围

最近工作当中遇到一个小问题，就是使用Element日期控件DatePicker的时候，当一个查询条件为日期区间，我要查两个月之间的数据，分别选择开始月和结束月，会出现一个问题，那就是结束月选的日期可以比开始月小，开始月选的日期可以比结束月大
就像这样

此时代码是这样写的

	开始月
	
	


	结束月
	
	

要想选中开始月之后，选择结束月不能比开始月小，选中结束月之后，选择开始月不能比结束月大，只需加一个picker-options属性就可以了，在picker-options中加上disabledDate属性用于限制日期选择的范围
代码如下

	开始月
	
	


	结束月
	
	

data中定义全局变量startMonthOption和endMonthOption

两个change方法如下

//开始月日期控件点击时触发此方法
selectStartMonth() {
	this.endMonthOption = {
		disabledDate: (time) => {
			if(this.smonthdateVal != '') {
				return time.getTime() < this.smonthdateVal;
			}
		}
	};
},
//结束月日期控件点击时触发此方法
selectEndMonth() {
	this.startMonthOption = {
		disabledDate: (time) => {
			if(this.emonthdateVal != '') {
				return time.getTime() > this.emonthdateVal;
			}
		}
	};
},

效果如下图


注：加picker-options属性之后日期控件的数据格式必须是日期格式，也就是不能加value-format=“yyyy-MM”，要想转换成字符串格式，只能后期通过方法转换，并且要保证每次执行change方法时，日期数据的格式都是日期格式，否则disabledDate属性不起作用