el-date-picker默认结束为当前时分秒

在element ui中的日期时间选择组件中默认是00:00,现在需求是点击默认结束时间为当前时分秒,查了很多资料写的都不准确

需求:实现日期时间组件可选择当前日期,比如当前是2024年01月17号下午17:21 那选中时必须结束时间为17:21 也可选01月17号当天其他的时间(很多文章超过17:21都不能选了,搞得我头疼

效果如下:

不多说,上代码:

 :default-time="['00:00:00', new Date().toLocaleTimeString('chinese', { hour12: false })]"

设置当前默认结束时间new Date().toLocaleTimeString('chinese', { hour12: false })

布局

这里主要代码是

 <el-form-item prop="carDate">
	<el-date-picker
	   v-model="ruleForm.carDate"
	   :picker-options="pickerOptions"
	   type="datetimerange"
	   value-format="yyyy-MM-dd HH:mm:ss"
	   :default-time="['00:00:00', new Date().toLocaleTimeString('chinese', { hour12: false })]"
	   range-separator="至"
	   start-placeholder="开始时间"
	   end-placeholder="结束时间"
	 >
	 </el-date-picker>
	</el-form-item>

校验

   pickerOptions: {
        disabledDate: time => {     
          return time.getTime() > Date.now()
        }
      },

难点:默认选中当前时分秒

相关推荐
Fan_web14 分钟前
jQuery——事件委托
开发语言·前端·javascript·css·jquery
Jiaberrr1 小时前
Element UI教程:如何将Radio单选框的圆框改为方框
前端·javascript·vue.js·ui·elementui
安冬的码畜日常3 小时前
【D3.js in Action 3 精译_029】3.5 给 D3 条形图加注图表标签(上)
开发语言·前端·javascript·信息可视化·数据可视化·d3.js
太阳花ˉ3 小时前
html+css+js实现step进度条效果
javascript·css·html
john_hjy4 小时前
11. 异步编程
运维·服务器·javascript
风清扬_jd4 小时前
Chromium 中JavaScript Fetch API接口c++代码实现(二)
javascript·c++·chrome
yanlele4 小时前
前瞻 - 盘点 ES2025 已经定稿的语法规范
前端·javascript·代码规范
It'sMyGo4 小时前
Javascript数组研究09_Array.prototype[Symbol.unscopables]
开发语言·javascript·原型模式
xgq5 小时前
使用File System Access API 直接读写本地文件
前端·javascript·面试