avatar

解决element-ui的时间选择器选择的时间传入后端有时区问题和时间异常的问题

异常说明

1
2
前端页面选择的时间为: 2020-07-28 00:00:00
element-ui传入后端的数据为 2020-07-27T16:00:00:000Z,存在时区问题,并且有时候传输到后台的日和前端选择的日期一致,从而导致了存储的时间出现偏差

解决方法

使用document.getElementById获取指定id的value值

1
_this.resourceapplication.requiredTimeOfReadiness = document.getElementById("requiredTimeOfReadiness").value;

使用value-format

1
<el-date-picker v-model="resourceapplication.requiredTimeOfReadiness" type="datetime" placeholder="选择日期时间" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>

效果说明

使用document.getElementById获取指定id的value值

1
2
3
在添加或修改数据到后端的事件被执行时,通过将获取到的时间选择框中的数据赋值给对应的v-model(resourceapplication.requiredTimeOfReadiness),解决了时间出现误差的可能,并且传输到后端的数据也不再存在时区问题
赋值给v-model的数据: 2020-07-28 00:00:00
后端获取到的数据: 2020-07-28 00:00:00

时间选择器代码
save点击事件
save点击事件提交代码

使用value-format

value-format

文章作者: 123
文章链接: https://gao5805123.github.io/123/2020/07/05/%E8%A7%A3%E5%86%B3element-ui%E7%9A%84%E6%97%B6%E9%97%B4%E9%80%89%E6%8B%A9%E5%99%A8%E9%80%89%E6%8B%A9%E7%9A%84%E6%97%B6%E9%97%B4%E4%BC%A0%E5%85%A5%E5%90%8E%E7%AB%AF%E6%9C%89%E6%97%B6%E5%8C%BA%E9%97%AE%E9%A2%98%E5%92%8C%E6%97%B6%E9%97%B4%E5%BC%82%E5%B8%B8%E7%9A%84%E9%97%AE%E9%A2%98/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 123
打赏
  • 微信
    微信
  • 支付宝
    支付宝