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>