效果图如下:
代码:
<!--日历-->
<el-calendar v-model="value" style="height:620px" class="el_cal_out">
<template slot="dateCell" slot-scope="{ data}">
<p style="margin:0px">
{{ data.day.split('-').slice(2).join() }}<br />
<!--标记-->
<div v-for="(i, index) in dayTime" :key="index">
<div v-if="data.day==i" class="budge"></div>
</div>
</p>
</template>
</el-calendar>
<script>
export default {
data () {
dayTime: ["2021-03-28", "2021-01-26", "2021-03-16"]
}
}
</script>
<style scoped>
.budge {
width: 8px;
height: 8px;
background: #e6a23c;
border-radius: 50%;
margin: 0 auto;
margin-top: 10px;
}
</style >
**
**