element 日期时间组件默认显示当前时间

背景:

日期时间组件,默认时间显示当前时间,或者当前时间的第2天:

const _deadline = new Date();

_deadline.setTime(_deadline.getTime() + 24 * 60 * 60 * 1000);

const _str = formatTime(_deadline);//自定义方法,转成"YY-MM-DD hh:mm:ss"形式

绑定这个默认值:

<el-date-picker

v-model="_str"

type="datetime"

placeholder="请选择"

:default-time="state.defaultTime || defaultTime"

value-format="YYYY-MM-DD HH:mm:ss"

:readonly="state.isReadonly || false"

:disabled-date="state.disabledDate"

/>

封装方法:

javascript 复制代码
export const formatTime = (time, format = "YY-MM-DD hh:mm:ss") => {
  const args = {
    y: time.getFullYear(),
    M: time.getMonth() + 1,
    d: time.getDate(),
    h: time.getHours(),
    m: time.getMinutes(),
    s: time.getSeconds(),
  };
  for (const key in args) {
    const value = args[key];
    if (value < 10) args[key] = "0" + value;
  }
  const dateStr =
    args.y +
    "-" +
    args.M +
    "-" +
    args.d +
    " " +
    args.h +
    ":" +
    args.m +
    ":" +
    args.s;
  return dateStr;
};
相关推荐
Mintopia5 分钟前
让开发效率翻倍的,往往不是新技术,而是小工具
前端
九皇叔叔5 分钟前
001-SpringSecurity-Demo 创建项目
java·springboot·springsecurity
Cobyte6 分钟前
2.响应式系统基础:依赖追踪的基础 —— 发布订阅模式(前端应用最广的设计模式)
前端·javascript·vue.js
慧一居士9 分钟前
Nitro 和nuxt4框架关系
前端
IT_陈寒12 分钟前
React的useEffect把我坑惨了,这种闭包问题谁能想到
前端·人工智能·后端
不会kao代码的小王14 分钟前
Linux 下 Tomcat 结合内网穿透 实现 Web 应用公网访问
java
ooseabiscuit18 分钟前
springboot下使用druid-spring-boot-starter
java·spring boot·后端
xuankuxiaoyao22 分钟前
VUE.JS实践--事件对象和计算属性
javascript·vue.js·ecmascript
前端老石人23 分钟前
表单与交互式元素
前端·css·html
青衫码上行25 分钟前
【从零开始学习JVM】内存模型+堆栈的区别
java·jvm·学习·面试