当前位置: 首页 > news >正文

关于 vue+element 日期时间选择器 限制只能选当天以及30天之前的日期

业务需求,需要实现选择当天以及30天之前的日期,于是我想到的是利用picker-options去限制可选范围
代码如下

 <el-date-pickerv-model="searchData.acceptTime"type="datetimerange"value-format="yyyy-MM-dd hh:mm:ss"style="width: 200px;margin-right: 10px":editable="false":clearable="false" :picker-options="pickerOptions"	:default-time="['00:00:00', '23:59:59'] "start-placeholder="开始日期"end-placeholder="结束日期"/>

js

data(){
return {pickerOptions: {disabledDate(date ) {let now = Date.now() let limitDays = 31 * 24 * 60 * 60 * 1000 // 30天的毫秒数let ts = date.getTime() //过滤的日期if ((ts <= now && ts > now - limitDays) ) return false // 启用return true // 禁用}},
}
}

这样写,有个问题,就是没法选中今天的日期,选了,确定按钮没法点,
在这里插入图片描述
然后我将 :default-time=“[‘00:00:00’, ‘23:59:59’] " 改成 :default-time=”[‘00:00:00’, ‘00:00:00’] "就可以了,但是似乎没有达到需求,请大佬给出建议

http://www.lryc.cn/news/493131.html

相关文章:

  • 租辆酷车小程序开发(二)—— 接入微服务GRPC
  • 如何在 Ubuntu 22.04 上安装 Metabase 数据可视化分析工具
  • MySQL 用户与权限管理
  • 【Web前端】如何构建简单HTML表单?
  • Spring Boot 3 集成 Spring Security(3)数据管理
  • 书生大模型实战营第四期-入门岛-4. maas课程任务
  • Spring ApplicationListener监听
  • K8s调度器扩展(scheduler)
  • IntelliJ IDEA 中,自动导包功能
  • Spring事务笔记
  • SQLite 管理工具 SQLiteStudio 3.4.5 发布
  • QT 实现组织树状图
  • go-学习
  • 【面试分享】主流编程语言的内存回收机制及其优缺点
  • STM32-- 串口发送数据
  • 数据结构 (13)串的应用举例
  • qt-- - 版本和下载介绍
  • 解锁 Vue 项目中 TSX 配置与应用简单攻略
  • ShuffleNet:一种为移动设备设计的极致高效的卷积神经网络
  • yum源问题的解决方案
  • 在Linux中备份msyql数据库和表的详细操作
  • 实时数仓Kappa架构:从入门到实战
  • 【老白学 Java】Warship v2.0(四)
  • LLM之学习笔记(一)
  • C# 反射详解
  • pgadmin安装后运行不能启动界面的问题
  • 跳表(Skip List)
  • 前端实现把整个页面转成PDF保存到本地(DOM转PDF)
  • Vue 3 学习文档(一)
  • 【适配】屏幕拖拽-滑动手感在不同分辨率下的机型适配