将Element UI的时间选择器(DatePicker)的Sat Jan 01 2022 00:00:00 GMT+0800 (中国标准时间)转化为XXXX-XX-XX的格式

将Sat Jan 01 2022 00:00:00 GMT+0800 (中国标准时间)转化为XXXX-XX-XX的格式

在使用element UI的时间选择器时,控制台输出的是Sat Jan 01 2022 00:00:00 GMT+0800 (中国标准时间)的格式,不管在查询还是添加到数据库我们使用的都是数据库中的date(xxxx-xx-xx)等格式。如何将上面的格式转化未所需要的格式呢?

  • 获取标准时间的有用信息

获取有用信息的js代码感谢作者@不过一念间,内容如下:

let yy = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getFullYear();
let mm = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getMonth()+1;
let dd = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getDate();
let hh = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getHours();
let mf = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getMinutes();
let ss = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getSeconds();

上面的js代码是获取标准时间的年月日时分秒的单个值,将new部分后替换为element ui的v-model的值就可以了。

  • element ui的datepicker格式转化
<el-date-picker
      v-model="value1"
      type="date"
      placeholder="选择日期">
</el-date-picker>

上面的datepicker绑定一个value1的对象就是标准时间,当有多个绑定值时就是数组的类型了,通过下表就可以取出单个的标准时间。
在这里插入图片描述

如下所示:

 <el-date-picker
    v-model="value"
    type="daterange"
    start-placeholder="开始日期"
    end-placeholder="结束日期"
    :default-time="['00:00:00', '23:59:59']"
    style="margin-left: 50px">
</el-date-picker>

该事件格式为:
在这里插入图片描述
如果在控制台输出value是标准时间,对其进行转化:

console.log(this.value)
let yy = this.value[0].getFullYear();
let mm = this.value[0].getMonth()+1;
let dd = this.value[0].getDate();
console.log(yy+"-"+mm+"-"+dd);

let yy1 = this.value[1].getFullYear();
let mm1 = this.value[1].getMonth()+1;
let dd1 = this.value[1].getDate();
console.log(yy1+"-"+mm1+"-"+dd1);

//对比一下
//let yy = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getFullYear();
//let mm = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getMonth()+1;
//let dd = new Date(Fri Jan 01 2020 00:00:00 GMT+0800).getDate();

在这里插入图片描述
得到需要的数据,虽然不是标准的xxxx-xx-xx但不影响对数据的操作。

<p><fontface>本程序基于新云网站管理系统V3.0.0.610修改美化,适合做文章、新闻、信息类综合网站,含6条采集规则,可自动抓取信息,因压缩包大小问题,删除生成的内容网页和文中图片,其余数据完整。</font></p> <p><fontface>采用新云系统成熟、稳定地技术ASP+Access/SQL修改而成,通过它,您可以很方便地管理自己网站。</font></p> <p><fontface>修改者声明:你可以任意修改程序,请保留我一个友情链接。 链接地址:http://www.ipaoniu.com/</font></p> <p><fontface>功能特点如下:(来自新云的官方说明)</font></p> <p><fontface>多频道管理,无限制频道克隆,支持频道二级域名绑定功能,文章内容自动分页;</font></p> <p><fontface>全站生成HTML页面;增加系统安全性,自由设置生成HTML文件扩展名和存放目录,内容自动分页。</font></p> <p><fontface>用户管理,多用户管理分权限发布、管理软件信息;用户短信、收藏功能,会员在线充值,网银在线支付;</font></p> <p><fontface>下载模块,支持计点会员和包月会员下载,反点等功能,无限制添加下载服务器,下载点数设置,添加软件只需要填写软件名称;</font></p> <p><fontface>强大的文章、软件采集功能,文章采集的同可以选择是否下载图片到本地及分页采集; 其它模块,留言、友情连接自助申请,上传水印,内容关键字功能。</font></p> <p><fontface>后台登陆地址:/admin/admin_login.asp 默认管理员:admin 密码:ipaoniu</font></p>
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

xvwen

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值