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()
        }
      },

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

相关推荐
古蓬莱掌管玉米的神9 小时前
vue3语法watch与watchEffect
前端·javascript
拉一次撑死狗9 小时前
Vue基础(2)
前端·javascript·vue.js
wjs040610 小时前
用css实现一个类似于elementUI中Loading组件有缺口的加载圆环
前端·css·elementui·css实现loading圆环
qq_5443291711 小时前
下载一个项目到跑通的大致过程是什么?
javascript·学习·bug
Jane - UTS 数据传输系统13 小时前
VUE+ Element-plus , el-tree 修改默认左侧三角图标,并使没有子级的那一项不展示图标
javascript·vue.js·elementui
ThomasChan12315 小时前
Typescript 多个泛型参数详细解读
前端·javascript·vue.js·typescript·vue·reactjs·js
zzlyx9915 小时前
.NET 9 微软官方推荐使用 Scalar 替代传统的 Swagger
javascript·microsoft·.net
Bunury15 小时前
组件封装-List
javascript·数据结构·list
我命由我1234516 小时前
NPM 与 Node.js 版本兼容问题:npm warn cli npm does not support Node.js
前端·javascript·前端框架·npm·node.js·html5·js
Orange30151116 小时前
【自己动手开发Webpack插件:开启前端构建工具的个性化定制之旅】
前端·javascript·webpack·typescript·node.js