最近在用vue,遇到倒计时在ios上显示为NAN的问题。

因为做的是倒计时支付,思路是获取服务器时间和下单时间,再转成秒级时间戳做差值。

在网上找到说是ios 不支持例如2018-09-01 10:00:59这种"-"连接符。

网上的解决是:

var date = '2018-09-01 12:00:00'
var time= Date.parse(new Date(date))

然后用正则匹配改一下,将-替换为/

var date = '2018-09-01 12:00:00'
var format = date.replace(/-/g, '/')
var time= Date.parse(new Date(format))

但是问题还是没有解决,在ios上仍然显示为NAN

于是想到用moment.js,成功解决问题!!!

vue中先引入npm install moment --save

import moment from 'moment/moment'

然后

//注意:苹果手机不支持以“-”分割的时间形式,故必须进行格式转换为'YYYY/MM/DD HH:mm:ss'。
//date格式是后台返回过来的Timestamp 2018-09-01T09:10:41.000+0000
let transTime = moment(date).format('YYYY/MM/DD HH:mm:ss')
console.log(transTime)

输出

2018/09/01 09:10:41
//转为时间戳
let omTime = this.transformTime(transTime) transformTime(t){
console.log('转换前的时间'+t)
//利用moment工具生成date对象
let date = moment(t).toDate()
console.log('date:'+ date)
//变成秒级时间戳
return moment(date).valueOf()
}

这个omTime时间戳就可以用来和服务器的时间戳做差值实现倒计时了,

经测试,在android和ios上都没问题,问题终于搞定!!!

有关moment.js基本操作可参考:

https://blog.csdn.net/badmoonc/article/details/82142100

这里mark记录一下,分享给你们,避免踏坑太久。

vue中解决时间在ios上显示NAN的问题的更多相关文章

  1. JS文件中的中文在网页上显示为乱码解决方法

    转自:http://www.pc6.com/infoview/Article_63835.html 如果JS文件中的中文在网页上显示为乱码,不妨采用本文章中的方法来试一试,或许能解决使你很头疼的问题. ...

  2. vue中解决chrome浏览器自动播放音频 和MP3语音打包到线上

    一.vue中解决chrome浏览器自动播放音频 需求 有新订单的时候,页面自动语音提示和弹出提示框: 问题 chrome浏览器在18年4月起,就在桌面浏览器全面禁止了音视频的自动播放功能.严格地来说, ...

  3. vue 中使用iconfont Unicode编码线上字体图标的流程

    1.打开http://www.iconfont.cn官网,搜索你想要的图标.添加字体图标到购物车,点击购物车然后添加至项目,点击确定 2.点击图标管理/我的项目,找到对应的文件,点击Unicode,然 ...

  4. 记录下hbuilder vue项目打包APP 在IOS上点击延迟的问题

    做的项目打包成APP在IOS 上有延迟问题,在安卓下却不会,联想到之前 用IONIC时打包的APP也是 在IOS下有300毫秒延迟问题.所以 只能 认吧. 安装fastclick 插件: npm in ...

  5. Android中使用Notification在状态栏上显示通知

    场景 状态栏上显示通知效果 注: 博客: https://blog.csdn.net/badao_liumang_qizhi关注公众号 霸道的程序猿 获取编程相关电子书.教程推送与免费下载. 实现 新 ...

  6. 解决scroll在ios上卡顿问题和兼容ios不支持:active伪类情况

    //有时候因为滚动层级元素过多会产生卡顿,特别在ios上十分明显,如果不想更换其他实现方式,可以加:-webkit-overflow-scrolling: touch; 开启硬件加速: 兼容ios不支 ...

  7. ios日期显示NaN

    ios中js通过getMonth()获取到的日期显示NaN,而在其他地方如pc.安卓都是ok的,这是为什么呢,原来这里有个ios的兼容问题,需要将日期中的“-”替换为“/” var time = ne ...

  8. iOS开发中获取视图在屏幕上显示的位置

    在iOS开发中,我们会经常遇到一个问题,例如,点击一个按钮,弹出一个遮罩层,上面显示一个弹框,弹框显示的位置在按钮附近.如果这个按钮的位置相对于屏幕边缘的距离是固定的,那就容易了,可以直接写死位置.可 ...

  9. 关于PHP中拿到MySQL中数据中的中文在网页上显示为?的解决办法!

    问题: 解决方案: 在PHP 代码中 输入 : //$connection 是链接数据库返回的变量名: mysqli_set_charset($connection,'utf8'); 完美解决:

随机推荐

  1. coding++:Spring_IOC(控制反转)详解

    IoC是什么: 1):Ioc—Inversion of Control,即“控制反转”,不是什么技术,而是一种设计思想. 2):在Java开发中,Ioc意味着将你设计好的对象交给容器控制,而不是传统的 ...

  2. coding++:SpringBoot 处理前台字符串日期自动转换成后台date类型的三种办法

    第(1)种: 使用@DateTimeFormat(pattern = “yyyy-MM-dd HH:mm:ss”)注解在实体字段上. 这种方式的优点是:可以灵活的定义接收的类型 缺点很明显:不能全局统 ...

  3. Thread Future模式

    多线程不管是extends Thread 还是 implements Runnable 都是要重写run 方法来实现,这两种方式子线程都没有返回值. 如果要实现主线程对子线程的监听,让子线程有返回值, ...

  4. Fast Enumeration

    在 Objective-C 2.0 中提供了快速枚举的语法,它是我们遍历集合元素的首选方法.它具有以下优点: 比直接使用 NSEnumerator 更高效: 语法非常简洁: 如果集合在遍历的过程中被修 ...

  5. [洛谷1437&Codevs1257]敲砖块<恶心的dp>

    题目链接:https://www.luogu.org/problem/show?pid=1437#sub http://codevs.cn/problem/1257/ 不得不说,这个题非常的恶心,在初 ...

  6. java初学复习

    作为学Java的小白,忽然想看一看自己学了些什么东西,话不多说,(这都是新手弄的总结)让我们看一看: 1.我们要先了解Java技术 Java SE:标准版java技术的基础和核心 Java EE:企业 ...

  7. 技术再深入一点又何妨?一脸懵B的聊Actor

    记得上次深入 Resin 源码时,见到了Actor 字眼,当时主要从 Resin 中抽取关键架构,就屏蔽了 Actor 相关代码.未曾想这两天研究 flink 的运行架构以及源码,再次与 Actor ...

  8. MATLAB实现一个EKF-2D-SLAM(已开源)

    1. SLAM问题定义 同时定位与建图(SLAM)的本质是一个估计问题,它要求移动机器人利用传感器信息实时地对外界环境结构进行估计,并且估算出自己在这个环境中的位置,Smith 和Cheeseman在 ...

  9. 新建基于STM32F103ZET6的工程-寄存器版本

    1.新建空白工程 新建一个文件夹,用来存放新建的工程文件.在这个新建的文件夹下创建MDK-PRO和OUTPUT两个子文件夹.MDK-PRO文件夹用来存放工程文件:OUTPUT用来存放工程编译器后输出的 ...

  10. vue 动态添加body背景图片

    <script> export default {   data () {     return {      bodyBgImage: 'url(' + require('../asse ...