el-date-picker 置灰一些时间
时间: 2023-08-17 19:06:53 浏览: 97
对于 Element UI 的 el-date-picker 组件,要将某些时间置灰,可以使用 disabledDate 属性。disabledDate 是一个函数,它接收一个参数 date,表示当前日期,你可以根据 date 的值返回一个布尔值来确定是否禁用该日期。
下面是一个示例代码,展示如何禁用2022 年1月1 日之前的所有日期:
```html<template>
<el-date-picker v-model="pickedDate"
:disabled-date="disabledDate"
type="date"
placeholder="选择日期"
></el-date-picker>
</template>
<script>
export default {
data() {
return {
pickedDate: null,
};
},
methods: {
disabledDate(date) {
const limitDate = new Date('2022-01-01'); // 设置限制日期 return date.getTime() < limitDate.getTime(); // 返回 true 表示禁用该日期 },
},
};
</script>
```
在 disabledDate 方法中,我们将限制日期设为2022 年1月1 日,然后通过比较 date 和 limitDate 来决定是否禁用该日期。返回 true 表示禁用,返回 false 表示不禁用。
你可以根据自己的需求修改 disabledDate 方法中的逻辑,来实现你想要禁用的日期。
阅读全文