element日历calendar组件上月、今天、下月、日历块点击事件及模板源码

  辰小白小白最近在写日历模板，项目已经用了element组件，奈何element日历组件官方文档提供的资料实在太少了。所以这里希望有相关开发需要的朋友能够少走一些辰小白踩过的坑。

首先展示一些模板效果图：

 这个项目的详细介绍可以下辰小白的这篇文章：后端开发的福音，vue+element实现的vue-element-admin前台框架，开箱即用

下面是日历模板首页源码

.is-selected {
 color: #1989fa;
}
.p-popover {
 text-align: center;
}
._calendar {
 height: 99.5%;
 width: 100%;
}
.el-main {
 padding: 0px;
 overflow: hidden;
}
.calendar-info {
 height: 94%;
 overflow: auto;
}
.el-alert {
 margin: 15px 0px;
}
.el-alert:hover {
 transform: scale(1.02);
}
.el-alert:active {
 transform: scale(1.01);
}


._calendar .div-Calendar {
 height: 125px;
 box-sizing: border-box;
 padding: 8px;
}
._calendar .el-calendar-table .el-calendar-day {
 padding: 0px;
 height: 125px;
}
._calendar .el-container,
._calendar .el-calendar {
 height: 100%;
}
._calendar .el-card__body {
 padding: 0px;
}

 具体的几个点击事件都有备注，这里不细说了

到此这篇关于element日历calendar组件上月、今天、下月、日历块点击事件及模板源码的文章就介绍到这了,更多相关element calendar组件内容请搜索考高分网以前的文章或继续浏览下面的相关文章希望大家以后多多支持考高分网！