页面结构
<div class="calendar_content">
<div @click="dateActive(index)" v-for="(day,index) in week">
<div>{{day.xq}}</div>
<div :class="{ active:index==current}">{{day.ts}}</div>
</div>
</div>
获取时间
gedate() {
var currentTime = new Date();
var nowDayOfWeek = currentTime.getDay(); //当前周的第几天
var nowDay = currentTime.getDate(); //当前日
var nowMonth = currentTime.getMonth(); //当前月
var nowYear = currentTime.getFullYear(); //当前年
currentTime = new Date(nowYear, nowMonth, nowDay - nowDayOfWeek + 1); //完整日期
var weeks = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
for (var i = 0; i < 7; i++) {
if (i == 0) {
currentTime = currentTime.setDate(currentTime.getDate());
} else {
currentTime = currentTime.setDate(currentTime.getDate() + 1);
}
currentTime = new Date(currentTime);
var currentDays = currentTime.getDate();
var currentMon = currentTime.getMonth() + 1;
var dateDay = currentDays //某一天
var dates = {};
this.currenttime = currentMon + "-" + nowDay
dates.Monthday = currentMon + "-" + dateDay
dates.ts = dateDay
dates.xq = weeks[i]
this.week.push(dates)
}
},
选择当前日期样式
dateActive(index) {
this.current = index;
var need = this.week[index].xq //获取选中的值
this.currenttime = this.week[index].Monthday
console.log(need)
},
结果页