最近在用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. 8 个出没在 Linux 终端的诡异家伙

    这篇文章,我们一起来到 Linux 的诡异的一面-- 你知道吗?在我们日常使用的 Unix(和 Linux )及其各种各样的分支系统中,存在着一些诡异的命令或进程,它们让人毛骨悚然,有些确实是有害,但 ...

  2. 将java中Map对象转为有相同属性的类对象(json作为中间转换)

    java中Map对象转为有相同属性的类对象(json作为中间转换) 准备好json转换工具类 public class JsonUtil { private static ObjectMapper o ...

  3. [讲解]prim算法<最小生成树>

    最小生成树的方法一般比较常用的就是kruskal和prim算法 一个是按边从小到大加,一个是按点从小到大加,两个方法都是比较常用的,都不是很难... kruskal算法在本文里我就不讲了,本文的重点是 ...

  4. 一文摸透从输入URL到页面渲染的过程

    一文摸透从输入URL到页面渲染的过程 从输入URL到页面渲染需要Chrome浏览器的多个进程配合,所以我们先来谈谈现阶段Chrome浏览器的多进程架构. 一.Chrome架构 目前Chrome采用的是 ...

  5. Linux:注册系统服务

    [参考文章]:Systemd 入门教程:实战篇 [参考文章]:linux systemctl命令详解 1. 简介 将程序注册为系统服务后,可通过 systemctl 和 service 系统命令启动, ...

  6. rem样板

    window.onload=window.onresize=function(){ var rem=document.documentElement.clientWidth*20/320; docum ...

  7. linux系统部署安装过程

    1. 虚拟环境安装 1.新建虚拟机   2.虚拟机设置 2.系统历程 1.进入系统引导界面进行配置 引导项说明:            1.安装centos 系统                    ...

  8. HSRP热备份路由协议

    HSRP热备份路由协议 案例1:HSRP配置 案例2:三层交换配置HSRP 案例3:STP的配置 案例4:三层交换配置STP 1 案例1:HSRP配置 1.1 问题 在企业网络到外部的连接方案中,要求 ...

  9. VMwareWorkstation如何设置共享文件夹

    首先需要安装VMware Tools 这个嘛,应该是需要安装的,之前没有安装好像就没有设置成功. 没有安装的参考如何安装VMware Tools 然后在虚拟机设置里面设置共享路径 右键虚拟机名称,打开 ...

  10. 通过简单的ajax验证是否存在已有的用户名

    首先来说说我对ajax的理解:简单地来说就是在不重新刷新页面的情况下,实现数据的调用获得更新. 我在这里介绍的是要过jquery封装好的ajax,大家可以去了解一下使用原生的XMLHttpReques ...