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

element ui 精确控制日期控件 date-picker

https://github.com/element-plus/element-plus/discussions/17378

-- 某组件 xxx.vue
...
<el-date-pickerv-model="timeRange"type="daterange"range-separator="-"start-placeholder="开始日期"end-placeholder="结束日期"placeholder="请选择时间":default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 59)]"value-format="YYYY-MM-DD"></el-date-picker>
...
<script>
const timeRange= [dayjs(new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0, 0)).subtract(1, 'month').format('YYYY-MM-DD'),dayjs(new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59, 0)).format('YYYY-MM-DD')]
</script>

关键点:

1. default-time 控制该组件的时间部分的格式,即开始日期的时间:00:00:00,结束日期的时间:23:59:59

2. 仅仅如此还不够,根据github上的issue,当手动收入日期后,时间部分并没有被控制,而是当前时间。所以,加个 value-format="YYYY-MM-DD" 可与解决该问题

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

相关文章:

  • centos7安装指定版本php及扩展
  • 后端-对表格数据进行添加、删除和修改
  • 【学习笔记】手写 Tomcat 七
  • QT开发:详解 Qt 多线程编程核心类 QThread:基本概念与使用方法
  • 【芋道源码】gitee很火的开源项目pig——后台管理快速开发框架使用笔记(微服务版之本地开发环境篇)
  • 设计模式、系统设计 record part01
  • 服务器与普通电脑的区别是什么?
  • Vue3学习(六)Vue3 + ts几种写法
  • 【前端】ES6:Proxy代理和Reflect对象
  • 基于微信开发助手企鹅音乐微信小程序的设计与实现(源码+文档+讲解)
  • 学习Spring Boot,应该从哪里开始学起
  • 【JavaEE初阶】深入解析死锁的产生和避免以及内存不可见问题
  • 企微群管理软件:构建高效社群运营的新引擎
  • CORE 中间件、wwwroot
  • SpringBoot 与 Maven 快速上手指南
  • 大觅网之自动化部署(Automated Deployment of Da Mi Network)
  • 【C++】入门基础知识-1
  • Redis一些简单通用命令认识常用数据类型和编码方式认识Redis单线程模型
  • 使用电子模拟器 Wokwi 运行 ESP32 示例(Arduino IDE、VSCode、ESP32C3)
  • C嘎嘎入门篇:类和对象(1)
  • tomcat服务搭建部署ujcms网站
  • unity_Occlusion_Culling遮挡剔除学习
  • vue初学随笔
  • IDEA Dependency Analyzer 分析 maven 项目包的依赖
  • 微信小程序 - 最新详细安装使用 Vant weapp UI 框架环境搭建详细教程
  • 【C语言】手把手带你拿捏指针(完)(指针笔试、面试题解析)
  • Vue中input框自动聚焦
  • 基于Node.js+Express+MySQL+VUE实现的计算机毕业设计旅游推荐网站
  • 已存在的Python项目使用依赖管理工具UV
  • JavaWeb美食推荐管理系统