zoukankan      html  css  js  c++  java
  • 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记录一下,分享给你们,避免踏坑太久。

  • 相关阅读:
    八、springboot 简单优雅的通过docker-compose 构建
    【并发编程】ThreadLocal其实很简单
    计算机网络
    相似度
    不同激活函数的区别
    快速排序+归并排序
    xgboost
    c++面试
    PCA算法和SVD
    各种排序算法的时间复杂度和空间复杂度
  • 原文地址:https://www.cnblogs.com/wzs5800/p/9580785.html
Copyright © 2011-2022 走看看