vue vue-calendar-component日历组件（可直接使用）

install

npm i vue-calendar-component

vue文件引入

import Calendar from 'vue-calendar-component';
 
 components: {
    Calendar
  }

下面的放到要显示的位置

修改样式

.card div:nth-child(1){
    background-color:#BDC0BA;
    padding-bottom:0;
}
.card div:nth-child(3) div ,.card div:nth-child(2) div{
    height: 35px;
    width: 35px;
}
/*今天*/
.wh_content_item .wh_isToday[data-v-2ebcbc83]{
    background-color:rgb(139, 175, 241);
}
/*日历点击*/
.wh_content_item .wh_chose_day[data-v-2ebcbc83]{
     background-color:transparent; 
}
/*日历划过*/
.wh_item_date[data-v-2ebcbc83]:hover{
    background-color:rgb(111, 223, 223);
    border-radius: 100%;
}

效果图