ELement UI时间控件el-date-picker误差8小时解决办法

一、问题描述:

在项目中引用了elementui中的date-picker组件,选中的时间跟实际相差八小时,且格式不是自己想要的格式

复制代码
<el-date-picker
   type="date"
   placeholder="选择日期"
   format="yyyy/M/d"
   v-model="form.timestamp"
  ></el-date-picker>

如图输入的是:

得到的是

二、解决办法

①在data里定义变量

复制代码
form: {
        timestamp: new Date()
      },

②在使用form.timestamp之前要对它做处理

复制代码
this.form.timestamp = this.YymmddFormat(this.form.timestamp)

③在methods里加入方法;格式自己可定义;我这里输出的是yyyy/M/d 仅供参考哦

复制代码
YymmddFormat(newDate) {
      let Month = newDate.getMonth() + 1;
      Month = Month;
      let d = newDate.getDate();
      return [[newDate.getFullYear(), Month, d].join("/")].join("");
    },

如果要输出yyyy-MM-dd格式的,可参考如下代码

复制代码
YymmddFormat(newDate) {
      let Month = newDate.getMonth() + 1;
      Month = Month >= 10 ? Month : "0" + Month;
      let d = newDate.getDate();
      d = d >= 10 ? d : "0" + d;
      return [[newDate.getFullYear(), Month, d].join("-")].join("");
    },

如果加上时分秒,参考参考,可能有误。

复制代码
dateTrans(date) {
      let _date = new Date(parseInt(date));
      let y = _date.getFullYear();
      let m = _date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      let d = _date.getDate();
      d = d < 10 ? "0" + d : d;
      let h = _date.getHours();
      h = h < 10 ? "0" + h : h;
      let minute = _date.getMinutes();
      let second = _date.getSeconds();
      minute = minute < 10 ? "0" + minute : minute;
      second = second < 10 ? "0" + second : second;
      let dates = y + "-" + m + "-" + d + " " + h + ":" + m + ":" + s;
      return dates;
    },
相关推荐
江城开朗的豌豆几秒前
Vue项目多代理配置指南:轻松搞定跨域请求分流!
前端·javascript·vue.js
全宝2 分钟前
🚀 一文搞定 claude code:国内环境下的安装、配置与体验
前端·ai编程·claude
寻觅~流光7 分钟前
封装---优化try..catch错误处理方式
开发语言·前端·javascript·typescript
csj5010 分钟前
前端基础之《Vue(22)—安装MongoDB》
前端·vue
今天也在写bug13 分钟前
输入npm install后发生了什么
前端·npm·node.js
玲小珑38 分钟前
Next.js 教程系列(十六)Next.js 中的状态管理方案
前端·next.js
前端小巷子39 分钟前
web实现文件的断点续传
前端·javascript·面试
小磊哥er40 分钟前
【前端工程化】前端项目怎么做代码管理才好?
前端
jojo是只猫1 小时前
前端vue对接海康摄像头流程
前端·javascript·vue.js
10年前端老司机5 小时前
React无限级菜单:一个项目带你突破技术瓶颈
前端·javascript·react.js