elementui时间选择器限制选择日期范围

这篇博客介绍了如何使用ElementUI的时间选择器组件来限制用户只能选择当前日期及之前的15天内的日期。通过设置`pickerOptions`属性,利用`disabledDate`回调函数进行时间过滤,确保用户无法选择今天之后的日期。示例代码展示了两种不同的实现方式,一种阻止选择今天之后的任何日期,另一种允许选择当天及之前的15天。这有助于在前端表单中实现合规的日期输入控制。
摘要由CSDN通过智能技术生成

elementui时间选择器

<el-date-picker
  v-model="reimbDate"
  size="small"
  type="daterange"
  :picker-options="pickerOptions"
  value-format="yyyy-MM-dd"
  range-separator="-"
  start-placeholder="开始日期"
  end-placeholder="结束日期"
  placeholder="选择报销时间"
  @change="reimbDateChange(reimbDate)"
>
</el-date-picker>

不能选择今天之后的日期

 pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now() - 8.64e6;
        },
  },

只能选择当天及前面的十五天

pickerOptions1: {
    disabledDate(time) {
        const times = new Date(new Date().toLocaleDateString()).getTime() - 15 * 8.64e7 + 1;
        return time.getTime() > Date.now() || time.getTime() < times; 
    },
},
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值