element问题总结2

 20.隐藏el-calendar 的多余的日子

 /deep/ .el-calendar-table:not(.is-range) td.next {
   display: none;
 }

 /deep/ .el-calendar-table:not(.is-range) td.prev {
   visibility: hidden;
 }
 /deep/ .el-calendar-table td {
   border: 1px solid #dfe6ec;
 }

21.点击今天,上个月,下个月的时候,触发事件

handleCalender() { // 加载数据,目前展示所有数据
      this.$nextTick(() => {
        let prevBtn1 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(1)');// 点击上个月
        prevBtn1.addEventListener('click',() => {
          console.log('上个月');
        })
        let prevBtn2 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(2)'); // 点击上个月
        prevBtn2.addEventListener('click',() => {
          console.log('今天');
        })
        let prevBtn3 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(3)');// 点击下个月
        prevBtn3.addEventListener('click',() => {
          console.log('下个月');
        })
      })
    }

22.两个el-col直接加上竖线,高度根据最高的来

1.在el-row上加上 type="flex"

2.设置 

3.css: 重点align-self: stretch; 高度自适应

.separator {
  position: relative;
  width: 1px; /* 竖线宽度 */
  background-color: #ccc; /* 竖线颜色 */
  margin: 0 10px; /* 调整竖线与列的间距 */
  align-self: stretch; /* 高度自适应 */
}