基于Vue实现支持按周切换的日历

发布时间：2020-12-17 02:50:58 所属栏目：百科来源：网络整理

导读：基于Vue的日历小功能，可根据实际开发情况按每年、每月、每周、进行切换，具体内容如下 {{ currentYear }}年{{ currentMonth }}月一二三四五六日 {{ day.getDate() }} js部分：目前默认显示一周，可根据实际情况更改 div class="jb51code" pre class=

基于Vue的日历小功能，可根据实际开发情况按每年、每月、每周、进行切换，具体内容如下

{{ currentYear }}年{{ currentMonth }}月

js部分：目前默认显示一周，可根据实际情况更改

.date {
height: px2rem(180);
color: #333;

.month {
font-size: px2rem(24);
text-align: center;
margin-top: px2rem(20);
}

.weekdays {
display: flex;
font-size: px2rem(28);
margin-top: px2rem(20);

li {
flex: 1;
text-align: center;
}
}

.days {
display: flex;

li {
flex: 1;
font-size: px2rem(30);
text-align: center;
margin-top: px2rem(10);
line-height: px2rem(60);

.active {
 display: inline-block;
 width: px2rem(60);
 height: px2rem(60);
 color: #fff;
 border-radius: 50%;
 background-color: #fa6854;
}

.other-month {
 color: #e4393c;
}

}
}
}