解决vue axios提交日期,服务器接收少一天的问题

vue开发,页面上Element的日期选择器选择的日期,使用axios提交到服务器端。

选择时间提交后,发现后台获取的时间少了8个小时,如只有日期的会少一天,比如你选择的是 2025-12-10,服务器接收到的是2025-12-09。

这是因为用axios提交时需要qs.stringify()序列化,

qs默认的时间格式化为Date.prototype.toISOString;

返回的是格林威治时间比北京时间晚8小时

解决办法:

在vue工程的package.json文件引入moment包

复制代码
"moment": "^2.30.1"

在main.js里面添加代码

复制代码
// 解决时区和日期格式问题
import moment from 'moment'

Date.prototype.toISOString = function(){
    return moment(this).format('YYYY-MM-DD HH:mm:ss')
    //或者选择带时区的格式 YYYY-MM-DDTHH:mm:ss.SSS[Z]
    //return moment(this).format("YYYY-MM-DDTHH:mm:ss.SSS[Z]");
}

如果你不想全局处理,也可以这样:

复制代码
axios.defaults.transformRequest.unshift((params) => {
   if (params) {
     Object.keys(params).forEach((key) => {
       if (params[key] instanceof moment) {
         params[key] = params[key].format('YYYY-MM-DDTHH:mm:ss.SSS\\Z')
       }
    })
   }
   return params
 })

相关推荐
jingling5551 分钟前
css进阶 | 实现罐子中的水流搅拌效果
前端·css
zhengxianyi5151 小时前
只需3句让Vue3 打包部署后通过修改配置文件修改全局变量——实时生效
vue.js·前后端分离·数据大屏·ruoyi-vue-pro优化
悟能不能悟1 小时前
前端上载文件时,上载多个文件,但是一个一个调用接口,怎么实现
前端
可问春风_ren2 小时前
前端文件上传详细解析
前端·ecmascript·reactjs·js
羊小猪~~3 小时前
【QT】--文件操作
前端·数据库·c++·后端·qt·qt6.3
晚风资源组4 小时前
CSS文字和图片在容器内垂直居中的简单方法
前端·css·css3
Miketutu4 小时前
Flutter学习 - 组件通信与网络请求Dio
开发语言·前端·javascript
摘星编程4 小时前
React Native for OpenHarmony 实战:Swiper 滑动组件详解
javascript·react native·react.js
鸣弦artha4 小时前
Flutter框架跨平台鸿蒙开发——Build流程深度解析
开发语言·javascript·flutter
QQ4022054965 小时前
python基于vue的大学生课堂考勤系统设计与实现django flask pycharm
vue.js·python·django