ant design vue日历增加小圆点

Zh.冠军

于 2022-09-06 18:46:41 发布

阅读量1.2k

点赞数 1

分类专栏： Jeecg 前端

本文链接：https://blog.csdn.net/weixin_38673922/article/details/126731053

版权

日历增加小圆点

前端同时被 2 个专栏收录

48 篇文章 2 订阅

订阅专栏

Jeecg

20 篇文章 1 订阅

订阅专栏

一、效果

blog.csdnimg.cn/c740a22ce5804e38b04a79ba946ca7a0.png)

二、代码块

	 <a-calendar v-model:value="value" :fullscreen="false" @panelChange="onPanelChange" @select="onSelect(value)">
	   <template slot="dateCellRender" slot-scope="value" >
	         <span v-if="showSpot(value)">
	           <a-badge status="error"/>
	         </span>
	    </template>
	 </a-calendar>

	data(){
		return{
			dateList:['2022-09-10','2022-09-11','2022-09-12','2022-10-16','2022-11-16'],
		}
	}
   showSpot(value) {
       let flag;
       this.dateList.map(date=>{
         if(date==value.format('YYYY-MM-DD')) {
             flag = true;
         }
       })
       return flag;
   },