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;
};
相关推荐
SuperEugene14 小时前
TypeScript+Vue 实战:告别 any 滥用,统一接口 / Props / 表单类型,实现类型安全|编码语法规范篇
开发语言·前端·javascript·vue.js·安全·typescript
luom010214 小时前
SpringBoot - Cookie & Session 用户登录及登录状态保持功能实现
java·spring boot·后端
毕设源码-朱学姐14 小时前
【开题答辩全过程】以 骨科术后营养餐推荐系统为例,包含答辩的问题和答案
java
丶小鱼丶14 小时前
数据结构和算法之【栈】
java·数据结构
我是永恒14 小时前
上架一个跨境工具导航网站
前端
电子羊14 小时前
Spec 编程工作流文档
前端
希望永不加班14 小时前
SpringBoot 核心配置文件:application.yml 与 application.properties
java·spring boot·后端·spring
GISer_Jing14 小时前
从CLI到GUI桌面应用——前端工程化进阶之路
前端·人工智能·aigc·交互
还是大剑师兰特14 小时前
Vue3 报错:computed value is readonly 解决方案
前端·vue.js
liurunlin88814 小时前
HeidiSQL导入与导出数据
java