el-date-picker 设置值输出格式

el-date-picker 设置值输出格式

现象

在请求后端的时候因为日期格式不对导致后端请求报错

看到时间默认的格式为:2024-08-13T16:00:00.000Z

这个时间如果需要转换成时间格式还是比较费劲的

解决方案

方式1-对字符串进行处理

javascript 复制代码
formatDate(date) {
  // 格式化为 YYYY-MM-DD
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
  const day = String(date.getDate()).padStart(2, '0');
  return `${year}-${month}-${day}`;
}

方式2-直接使用elmentui的 value-format属性设置

javascript 复制代码
<el-form-item prop="createTimeFrom">
  <el-date-picker
    type="date"
    placeholder="选择开始日期"
    v-model="searchForm.createTimeFrom"
    value-format="yyyy-MM-dd"
    style="width: 100%;">
  </el-date-picker>
</el-form-item>

设置 value-format="yyyy-MM-dd"

更多设置可以参考elmentui的使用说明

官网链接:https://element.eleme.cn/#/zh-CN/component/date-picker

相关推荐
Setsuna_F_Seiei39 分钟前
前端转型 Agent 开发 05 之 Agent Hooks 与 Checkpointer(让 Agent 从全自动转变人为可掌控)
前端·agent·ai编程
百万蹄蹄向前冲3 小时前
风扇转了一晚上MVP专家团翻车事故
前端·人工智能
默_笙3 小时前
🏛 给 AI 配一间办公室:Harness Engineering 六大模块与它的实现
前端·javascript
linux_cfan4 小时前
videojs v10 源代码系列解读:14 · 谓词守卫:在运行时安全地调用能力
前端·javascript·音视频
kyriewen4 小时前
我扒了 10,221 条 JD:腾讯技术岗 75% 在要 AI
前端·人工智能·ai编程
郑州光合科技余经理5 小时前
同城外卖小程序开发:下单成功后,后台导出能不能对上用户端状态
开发语言·前端·git·后端·uni-app·php·ai编程
+VX:Fegn08955 小时前
计算机毕业设计|基于springboot + vue旅游管理系统(源码+数据库+文档)
java·开发语言·vue.js·spring boot·课程设计
雪芽蓝域zzs6 小时前
第 7 章:双 Y 轴组合图(柱状 + 折线,看板高频场景)
vue.js·echars
IT_陈寒6 小时前
Vue的响应式让我熬到凌晨三点,原来漏了这个小细节
前端·人工智能·后端
一 乐6 小时前
二手交易平台|基于springboot + vue二手交易平台(源码+数据库+文档)
java·数据库·vue.js·spring boot·小程序