记录vue elementUI el-date-picker年度选择
记录vue elementUI el-date-picker年度选择需求实现方法代码实现实现效果需求el-date-picker年度选择器 能够动态禁用年份;如:禁止选用2021年2022年实现方法禁用某个年份正常是rutern (time.getFullYear() == 2022 || time.getFullYear() == 2024),所以就需要实现time.getFullYear()
·
需求
el-date-picker年度选择器 能够动态禁用年份;如:禁止选用2021年2022年
实现方法
禁用某个年份正常是rutern (time.getFullYear() == 2022 || time.getFullYear() == 2024),所以就需要实现time.getFullYear() == 2022 || time.getFullYear() == 2024动态,但实现出来的是string,所以使用eval来执行
代码实现
<el-form-item label="年度" prop="year">
<el-date-picker
v-model="year"
type="year"
style="width: 100%;"
:picker-options="pickerOptions"
value-format="yyyy"
placeholder="请选择年度">
</el-date-picker>
</el-form-item>
data () {
return {
year: '',
pickerOptions: {
}
}
}
created () {
const arr = ["2021", "2022", "2023", "2024", "2026", "2027", "2029", "2031", "2032", "2033"]
this.pickerOptions = {
disabledDate(time) {
let val = `${time.getFullYear()} == ${arr[0]}`
arr.forEach((v, k) => {
if (k > 0) {
val += ` || ${time.getFullYear()}==${v}`
}
})
return (eval(val))
}
}
}
实现效果
更多推荐
已为社区贡献1条内容
所有评论(0)