vue中解决时间在ios上显示NAN的问题
最近在用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的问题的更多相关文章
- JS文件中的中文在网页上显示为乱码解决方法
转自:http://www.pc6.com/infoview/Article_63835.html 如果JS文件中的中文在网页上显示为乱码,不妨采用本文章中的方法来试一试,或许能解决使你很头疼的问题. ...
- vue中解决chrome浏览器自动播放音频 和MP3语音打包到线上
一.vue中解决chrome浏览器自动播放音频 需求 有新订单的时候,页面自动语音提示和弹出提示框: 问题 chrome浏览器在18年4月起,就在桌面浏览器全面禁止了音视频的自动播放功能.严格地来说, ...
- vue 中使用iconfont Unicode编码线上字体图标的流程
1.打开http://www.iconfont.cn官网,搜索你想要的图标.添加字体图标到购物车,点击购物车然后添加至项目,点击确定 2.点击图标管理/我的项目,找到对应的文件,点击Unicode,然 ...
- 记录下hbuilder vue项目打包APP 在IOS上点击延迟的问题
做的项目打包成APP在IOS 上有延迟问题,在安卓下却不会,联想到之前 用IONIC时打包的APP也是 在IOS下有300毫秒延迟问题.所以 只能 认吧. 安装fastclick 插件: npm in ...
- Android中使用Notification在状态栏上显示通知
场景 状态栏上显示通知效果 注: 博客: https://blog.csdn.net/badao_liumang_qizhi关注公众号 霸道的程序猿 获取编程相关电子书.教程推送与免费下载. 实现 新 ...
- 解决scroll在ios上卡顿问题和兼容ios不支持:active伪类情况
//有时候因为滚动层级元素过多会产生卡顿,特别在ios上十分明显,如果不想更换其他实现方式,可以加:-webkit-overflow-scrolling: touch; 开启硬件加速: 兼容ios不支 ...
- ios日期显示NaN
ios中js通过getMonth()获取到的日期显示NaN,而在其他地方如pc.安卓都是ok的,这是为什么呢,原来这里有个ios的兼容问题,需要将日期中的“-”替换为“/” var time = ne ...
- iOS开发中获取视图在屏幕上显示的位置
在iOS开发中,我们会经常遇到一个问题,例如,点击一个按钮,弹出一个遮罩层,上面显示一个弹框,弹框显示的位置在按钮附近.如果这个按钮的位置相对于屏幕边缘的距离是固定的,那就容易了,可以直接写死位置.可 ...
- 关于PHP中拿到MySQL中数据中的中文在网页上显示为?的解决办法!
问题: 解决方案: 在PHP 代码中 输入 : //$connection 是链接数据库返回的变量名: mysqli_set_charset($connection,'utf8'); 完美解决:
随机推荐
- 知识图谱里的知识存储:neo4j的介绍和使用
一般情况下,我们使用数据库查找事物间的联系的时候,只需要短程关系的查询(两层以内的关联).当需要进行更长程的,更广范围的关系查询时,就需要图数据库的功能. 而随着社交.电商.金融.零售.物联网等行 ...
- Springboot 事务注解--- @Transactional
spring boot @Transactional事物处理 spring boot 添加事物使用 @Transactional注解 简单使用 在启动类上方添加 @EnableTransacti ...
- adb基本命令操作(四)
一,基本操作命令 adb shell:进入手机系统 说明:root表示手机当前的操作用户,也是最高权限操作者 cd ,可以切换目录,执行cd /sdcard 表示手机内部的存储路径,也是表示内部存储 ...
- ConcurrentHashMap1.7和1.8的源码分析比较
ConcurrentHashMap 在多线程环境下,使用HashMap进行put操作时存在丢失数据的情况,为了避免这种bug的隐患,强烈建议使用ConcurrentHashMap代替HashMap,为 ...
- 3.Metasploit攻击流程及命令介绍
Metasploit 进阶第一讲 攻击流程及命令介绍 01.渗透测试过程环节(PTES) 1.前期交互阶段:与客户组织进行交互讨论,确定范围,目标等 2.情报搜集阶段:获取更多目标组织信 ...
- STM32CubeMX的安装
1.下载STM32CubeMX 在ST的官方网站上下载STM32CubeMXXX软件的安装包. 下载的安装包如下图所示.双击SetupSTM32CubeMX-5.0.1.exe. 安装STM32Cub ...
- JDBCUtils,根据当前MySQL数据库下面的表生成java实体类
自己简单写的JDBCUtils,可以根据当前数据库下面的表生成java实体类,代码萌新,请多多包涵. 初始化配置: //驱动程序名//不固定,根据驱动 static String driver = & ...
- JVM 理解性学习(二)
1.G1 垃圾回收器 G1 能更少的 "Stop the World" ,能同时对新生代老年代进行垃圾回收. G1 将 Java 堆内存拆分为多个大小相等的 Region,并且新生 ...
- 【数据库】MySQL数据库(三)
一.MySQL当中的索引: 数组当中我们见过索引:它的好处就是能够快速的通过下标.索引将一个信息查到:或者说 能够快速的定位到一个信息: 1.MySQL中的索引是什么? 它是将我们表中具有索引的那个字 ...
- Linux基础篇,磁盘及文件使用管理
在windows系统下,我们可以使用图形化界面很明了的看出当前硬盘使用量与某个文件的占用空间大小和文件数量.但是在linux系统中,我们应该如何得到这些信息呢? 当然是功能强大的df与du了. 一.d ...