vue开发el-date-picker组件8小时时间差问题

最新推荐文章于 2024-03-19 10:10:44 发布

浪潮行舟

最新推荐文章于 2024-03-19 10:10:44 发布

阅读量1.8k

点赞数

分类专栏：前端 VUE 文章标签： vue.js javascript 前端 Powered by 金山文档

本文链接：https://blog.csdn.net/I_nur/article/details/129472659

版权

前端同时被 2 个专栏收录

56 篇文章 1 订阅

订阅专栏

VUE

27 篇文章 0 订阅

订阅专栏

在使用Element-UI的日期时间选择器el-date-picker时，发现查询数据存在8小时的时差。问题源于中国时间和格林威治时间的差异。通过修改value-format属性为yyyy-MM-ddHH:mm:ss，确保时间格式正确，从而解决了查询结果的错误。

摘要由CSDN通过智能技术生成

遇到问题

在使用element-UI进行开发的时候遇到一个问题

查询条件是时间组件el-date-picker时，查询的数据有问题

查找原因

F12查看接口调用情况

发现是datetime的时间比实际选中的时间早8小时

时间少了8小时，根本原因是：中国国家标准时间是东经120°（东八区）的地方时间,同格林威治时间（世界时）整整相差8小时

解决方案

在查询相关文档后，只需要更改时间组件el-date-picker的 value-format 的格式就可以了

<el-date-picker 
    style="width: 188px;height: 34px;border-radius: 5px;border: 1px solid #448DF6;"    
    value-format="yyyy-MM-dd HH:mm:ss" 
    v-model="formData.dateTime" 
    type="datetime" 
    placeholder="选择日期时间">
</el-date-picker>

最后再选择时间，点击查询，查询结果无误。