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'); 完美解决:
随机推荐
- HDU - 3068 最长回文manacher马拉车算法
# a # b # b # a # 当我们遇到回判断最长回文字符串问题的时候,若果用暴力的方法来做,就是在字符串中间添加 #,然后遍历每一个字符,找到最长的回文字符串.那么马拉车算法就是在这个基础上进 ...
- 在MVC三层项目中如何使用Log4Net
--前期准备(添加到队列中) 0-1在新建后的MVC项目中的[Models]中添加一个类,用于处理异常信息,并继承自HandleErrorAttribute public class MyExcept ...
- python学习第四节 迭代器 生成器
1:什么是迭代 可以直接作用于for循环的对象统称为可迭代对象(Iterable). 可以被next()函数调用并不断返回下一个值的对象称为迭代器(Iterator). 所有的Iterable均可以通 ...
- Oracle给权限和同义词
在同一个DB下,用户A创建了一个Table(student),用户B无法访问.如果B想要访问,就需要A赋予B权限. 登录用户A执行下面语句: GRANT SELECT, INSERT, UPDATE, ...
- Vue学习(2)---v-指令和组件
Vue中的指令 Vue中以带有前缀V-的属性被称为指令(带有v表示他们是Vue提供的特殊attribute) 一个v-bind的例子 <div id="app" v-bind ...
- .NET Core项目部署到Linux(Centos7)(十)总结
目录 1.前言 2.环境和软件的准备 3.创建.NET Core API项目 4.VMware Workstation虚拟机及Centos 7安装 5.Centos 7安装.NET Core环境 6. ...
- Linux利器:使用 gcc 编程C程序
文章更新于:2020-03-23 文章目录 一.手动编译链接单个C源文件 1.创建C源文件 2.编译源文件 3.生成可执行文件 二.手动编译链接多个C源文件 1.创建两个C源文件 2.编译两个源文件 ...
- 接口请求:get、post (requests方法)
https://www.cnblogs.com/lanyinhao/p/9634742.html 比较全面 1.模块说明 requests是使用Apache2 licensed 许可证的HTTP库. ...
- Python爬虫系列(一):从零开始,安装环境
在上一个系列,我们学会使用rabbitmq.本来接着是把公司的celery分享出来,但是定睛一看,celery4.0已经不再支持Windows.公司也逐步放弃了服役多年的celery项目.恰好,公司找 ...
- python3(十七) nonameFunc
L = list(map(lambda x: x * x, [1, 2, 3, 4, 5, 6, 7, 8, 9])) print(L) # [1, 4, 9, 16, 25, 36, 49, 64, ...