当前位置: 首页 > Web前端 > vue.js

单选联动填充日期选择器并转为数组进行日期拼接的方法

时间:2023-03-31 19:06:36 vue.js

1、效果图的开始日期为当天,结束日期可根据单选填写。选择本周,选择3月2号附近。"thismonth">

开始日期结束日期
3.js部分constd=newDate();//创建一个新的日期对象consttoday=d.toLocaleDateString();//获取今天的日期如:2020/7/26constday=today.split('/');//将今天的日期转换成数组,用/分割,day[0]是年,day[1]是月,day[2]是日:'',结尾:'',};},created(){this.today=d.toLocaleDateString();//页面创建时,给today赋值},methods:{Aperiod(){//选项状态改变时触发开关(this.period){case'本周':这周();休息;case'本月':this.ThisMonth();休息;案例“接近三月”:this.RecentThreeMonth();休息;默认值:中断;}},ThisWeek(){switch(d.getDay()){//获取今天的周名如:2020/7/26,返回0,即周日case0:this.end=`${day[0]}-${day[1]}-${Number(day[2])+5}`;//周日,本周工作天数+5break;情况1:this.end=`${day[0]}-${day[1]}-${Number(day[2])+4}`;//周一,本周工作天数+4break;情况2:this.end=`${day[0]}-${day[1]}-${Number(day[2])+3}`;//周二,本周工作天数+3break;情况3:this.end=`${day[0]}-${day[1]}-${Number(day[2])+2}`;//星期三,本周的工作天数+2break;案例4:this.end=`${day[0]}-${day[1]}-${Number(day[2])+1}`;//星期四,本周工作天数+1break;case5://eslint-disable-next-lineno-alertalert('今天是本周最后一个工作日~');//星期五,及时休息;默认值:中断;}},ThisMonth(){constmonth=newDate(day[0],day[1],0).getDate();//获取当月的天数this.end=`${day[0]}-${day[1]}-${month}`;},RecentThreeMonth(){if(day[1]<=9){//如果月份小于等于到9this.end=`${day[0]}-${Number(day[1])+3}-${day[2]}`;//月份直接+3}else{this.end=`${day[0]}-${Number(day[1])+3-12}-${day[2]}`;//月先+3,然后负12}},},};