element UI的日期选择器固定日期变色

element UI的日期选择器固定日期变色

用官方提供的方法picker-options
html

  <el-date-picker v-model="analyseForm.endTime"
               :picker-options="pickerOptions"
                   value-format="yyyy-MM-dd HH:mm:ss" type="date" style="width: 280px;"
                  placeholder="选择日期时间">
                </el-date-picker>

          pickerOptions: {//这是方法在data中return
          //arr是数组日期  ['2024-11-20','2024-11-21']  time.getTime()是时间戳  getLocalTime是将时间戳转换为yyyy-MM-dd形式的   
        cellClassName: (time) => {
          const localTime = this.getLocalTime(time.getTime());
        
          return this.arr.includes(localTime) ? 'red' : ''//将两个值进行对比  返回calss名red
        }
      },

css

<style lang="scss">
.red {
  div {
    span {
      background-color: #41cd4f !important;
      border-radius: 50px;
    }
  }
}
</style>

原文地址：https://blog.csdn.net/yangpengze/article/details/145204219

免责声明：本站文章内容转载自网络资源，如侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！