el-date-picker选择时间只能选择到分

说明

要求el-date-picker选择日期时间时，只允许选择到分，并且分的step=5，即只能选择0、5、10、15、...

实现要点

• 通过value-format="yyyy-MM-dd HH:mm" format="yyyy-MM-dd HH:mm"控制只选择到分

• 通过:disabled-minutes="disabledMinutes"禁用某些分钟，并且通过css样式将这些禁用的分钟数设置隐藏

代码

// template
<el-date-picker
    type="datetime"
    v-model="noticeForm.publishTime"
    placeholder="请选择日期时间"
    format="YYYY-MM-DD HH:mm"
    data-format="YYYY-MM-DD HH:mm"
    value-format="YYYY-MM-DD HH:mm:ss"
    :disabled-minutes="disabledMinutes"
    :editable="false"
/>
          
// script
const disabledMinutes = () => {
  let arr = [];
  for (let i = 0; i < 60; i++) {
    if (i % 5 !== 0) {
      arr.push(i);
    }
  }
  return arr;
};

//scss
<style lang="scss">
.el-time-spinner__item.is-disabled {
  display: none;
}
</style>