页面图片 ：
父组件：
<div class="pickerDemo">
<h6>第一个的时间：h6>
<div class="boxDate">
<div class="leftDate">当前时间：div>
<div class="rightDate">
<DateModel
@returnDate="returnDate1"
:date="date1"
:maxDate="maxDate1"
/>
div>
div>
<h6>第二个的时间：h6>
<div class="boxDate">
<div class="leftDate">当前时间2：div>
<div class="rightDate">
<DateModel
@returnDate="returnDate2"
:date="date2"
:minDate="minDate2"
/>
div>
div>
div>
>
import DateModel from './DateModel'
export default {
name: 'date',
data () {
return {
date1:'',
maxDate1:'',//第一个组件设置最大日期
date2:'',
minDate2:"",//第二个 组件设置最小日期
}
},
components: {
DateModel
},
created () {
},
mounted () {
let newDate=new Date();
this.maxDate1=this.dateYMD()
this.date2=this.dateYMD(0,0,28)//默认第二个显示大于第一个一天
this.minDate2=this.dateYMD()
},
methods: {
dateYMD(a,b,c){
let yy=parseInt(a) || 0,mm=parseInt(b) || 0,dd=parseInt(c) || 0,date=new Date(),y="",m="",d="";
y=date.getFullYear()+yy+'';
m=date.getMonth()+1+mm+'';
let monthDate=this.mGetDate(y,m);
if(dd<0){
if(date.getDate()<=-dd){
m=m-1+'';
let mDate=this.mGetDate(y,m);
d=date.getDate()+mDate+dd+''
}else{
d=date.getDate()+dd+'';
}
}else{
if(date.getDate()+dd>=monthDate){
m=parseInt(m)+1+'';
let mDate=this.mGetDate(y,m);
d=date.getDate()-mDate+parseInt(dd)+''
}else{
d=date.getDate()+dd+'';
}
}
m=m.length==1?('0'+m):m,
d=d.length==1?('0'+d):d;
return y+'-'+m+'-'+d;
},
mGetDate(){
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;
var d = new Date(year, month, 0);
return d.getDate();
},
returnDate1(v){
//第一个日期的回调函数 需要给第二个设置最小值
this.minDate2=v;
this.date1=v;
},
returnDate2(v){
//第二个日期选择框的回调函数
this.maxDate1=v;
this.date2=v;
}
}
}
>