vue3中 el-date-picker禁用今天之后
时间: 2023-07-25 09:29:03 浏览: 180
vue element-ui el-date-picker限制选择时间为当天之前的代码
如果您使用的是element-plus UI框架,可以通过设置`disabledDate`属性来禁用今天之后的日期。具体实现方法如下:
1. 在`el-date-picker`标签中添加`disabled-date`属性,并绑定一个函数。
```html
<el-date-picker v-model="date" :disabled-date="disabledDate"></el-date-picker>
```
2. 在Vue实例中定义`disabledDate`函数,该函数返回一个布尔值,表示是否禁用该日期。
```javascript
import { defineComponent } from 'vue'
import { ElDatePicker } from 'element-plus'
export default defineComponent({
components: { ElDatePicker },
data() {
return {
date: new Date()
}
},
methods: {
disabledDate(time) {
return time.getTime() > Date.now(); // 禁用今天之后的日期
}
}
})
```
通过这种方式,就可以实现禁用今天之后的日期了。需要注意的是,element-plus中的`el-date-picker`组件是通过`defineComponent`来定义的,而不是通过Vue实例。
阅读全文