组件中日期时间选择器设置时间段禁用时分秒的方法 vue
element ui 日期时间选择器禁用时分秒的方法vue (此刻之后的时间不可选择)关键点在于picker-options 的使用 disabledDate 禁用年月日 selectableRange禁用时分秒<el-date-pickerclass="picker"v-model="param.happen_date"value-format="yyyy-MM-dd HH:mm:ss"t
·
element ui 日期时间选择器禁用时分秒的方法 vue (此刻之后的时间不可选择)
关键点在于picker-options 的使用 disabledDate 禁用年月日 selectableRange禁用时分秒
<el-date-picker
class="picker"
v-model="param.happen_date"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
popper-class="date_picker"
:picker-options="pickerOptions"
placeholder="选择日期时间"
></el-date-picker>
data(){
return{
pickerOptions: {
disabledDate(time) {
return time.getTime() > Date.now() - 8.64e6; //如果没有后面的-8.64e6就是不可以选择今天的
},
selectableRange: `00:00:00 - ${
this.initTime(Date.now()) ? this.initTime(Date.now()) : "23:59:59"
}`
},
}
}
methods:{
initTime(time) {
let date = new Date(time);
let Y = date.getFullYear() + "-";
let M =
(date.getMonth() + 1 < 10
? "0" + (date.getMonth() + 1)
: date.getMonth() + 1) + "-";
let D = date.getDate() + " ";
let h = date.getHours() + ":";
let m = date.getMinutes() + ":";
let s = date.getSeconds();
return h + m + s;
},
}
效果图:
更多推荐
已为社区贡献2条内容
所有评论(0)