最近在用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記錄一下,分享給你們,避免踏坑太久。