之前写的elementui在使用日历(即日历控件)时，发现它所拥有的上个月、今天和下个月都不提供点击事件，但博主在我工作时使用因为要在调度时获取上个月的信息，需要每月提供，所以今天要记录解决方案。
添加事件时，created挂接函数将包含以下代码this.$nextTick () )/实现上个月的letprevbtn=document.query selector ('.El-calendar _ button-query selector ) )的prev BTN.addevent listener () )={console.info ) this.valuedata ) this.date format (yyyy-mm-DD )，this.valuedata}//今天的letcurrbtn=documened currBTN.addeventlistener(click )，)={ console.info } this.valuedata ) this.date format (yyyy-mm-DD )，this . next BTN.addevent listener (' click '，)={ console.info } this.valuedata ) this.dateformat ) yyyy-mm-DD， this.valuedata(} ) ) (时间格式代码/***@param(object ) fmt所需的时间格式例如为' yyyy-mm-DD'*@param ) object ) date date foor const opt={ ' y ' : date.getfullyear (.tostring )，//年' m': ) date.getmonth ) )1).tostring， //日' h':date.gethours(.toString )，/时' M ': date.getMinutes ).tostring )，/分钟) s'33666。 for(letkinopt ) ) ret=newregexp ) ) ) (' k ) ).exec ) fmt； if(ret ) ) fmt=fmt.replace ) ret[1]，(ret[1].length==1)？ (opt[k] ) : ) opt[k].padstart(ret[1].length，'0' ) ) )； (； 返回调频； }，打印结果的注意事项名为valueData的参数在data中定义。 也就是说，必须在return中定义valueData: new Date()。 然后，Calendar calendar控件可以绑定它并自动计算每月。 代码如下。
El-calendar v-model=' valuedata ' v-loading=' loading ' style=' margin-top :10 px ' templates lot=' datecell ' is-selected ' : ' ' { { data.day.split ('-' ).slice(1)1).join ) '-'}}{data.isselected？' : ' }/pel-row : gutter=' 20 ' El-col 3360 span=' 12 ' v-for=' iteminschdules [ data.day ] ' : flex-didules Justify-items3360中心； align-items : flex-start ' div style=' font-weight 3360 bold ' { item.shifts！==null？ 未设置item.shifts.name : '移位' }/div div { { item.user alias } } El-tagv-if=' item.user _ status item.uuus==' size=' mini ' type=' success ' { { item.user _ status } }/El-tag/div/div/El-col/El-row/div第一个这里有一点需要说。 官方给出的参数如果用得好的话，就能做更多的工作。 { type，isSelected，day}，type表示该日期所属的月份，选项值为prev-month、current-month、nexxth。is selected表示是否选择了该日期day是格式化的日期，是yyyy-MM-dd的格式
组件地址