原因:datepicker不是Vue的组件,input中的v-model属性不能使用
参考网站:https://blog.csdn.net/wwf1225/article/details/100130802
<div class="form-group row">
<label class="col-sm-4 col-form-label">开始时间:</label>
<div class="col-sm-8">
<div class="input-group date">
<div class="form-group" id="dateSelect">
<div class="input-group date">
<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
<input type="text" class="form-control startDate" readonly="readonly" />
</div>
</div>
</div>
</div>
</div>
<div class="hr-line-dashed"></div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">结束时间:</label>
<div class="col-sm-8">
<div class="input-group date">
<div class="form-group" id="dateSelect">
<div class="input-group date">
<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
<input type="text" class="form-control endDate" readonly="readonly" />
</div>
</div>
</div>
</div>
</div>
js中格式化后的时间数据比较大小:
//两个时间判断大小
var startTime=new Date(Date.parse($('.startDate').val().replace(/-/g,'/')));
var endTime=new Date(Date.parse($('.endDate').val().replace(/-/g,'/')));
if(endTime<startTime){
alert('开始时间必须小于等于结束时间');
return false;
}