最近在用vue，遇到倒計時在ios上顯示為NAN的問題。

因為做的是倒計時支付，思路是獲取服務器時間和下單時間，再轉成秒級時間戳做差值。

在網上找到說是ios 不支持例如2018-09-01 10:00:59這種"-"連接符。

網上的解決是：

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

然後用正則匹配改一下，將-替換為/

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上都沒問題，問題終於搞定！！！

這裏mark記錄一下，分享給你們，避免踏坑太久。

vue中解決時間在ios上顯示NAN的問題