element时间选择器datetime只要整点
时间: 2023-10-01 18:02:51 浏览: 50
你可以使用element-ui库中的DateTimePicker组件来实现只选择整点的时间。在DateTimePicker组件上设置picker-options属性,通过设置pickerOptions.disabledMinutes为一个函数来禁用分钟选择。具体代码如下所示:
```html
<template>
<div>
<el-form :model="form">
<el-form-item label="选择时间">
<el-date-picker
v-model="form.date"
type="datetime"
:picker-options="pickerOptions"
format="yyyy-MM-dd HH"
></el-date-picker>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
data() {
return {
form: {
date: '',
},
pickerOptions: {
disabledMinutes: () => {
return Array.from({ length: 60 }, (_, index) => index).filter(
(minute) => minute !== 0
);
},
},
};
},
};
</script>
```
上述代码中,form.date是绑定的时间选择器的值,pickerOptions.disabledMinutes是一个函数,返回一个数组,表示要禁用的分钟选项。这里使用Array.from和filter方法生成了从0到59的分钟数组,然后过滤掉了0分钟,即只剩下整点。
注意:上述代码是在Vue项目中使用element-ui库实现的,你可以根据自己的项目需求进行相应的调整。