• 小程序时间格式倒计时


    我们在做许多样式的时候都会有倒计时的,有秒倒计时的,分的,小时的,已以及多少天倒计时的

    所以,总结了一个还有多少天倒计时的demo;

    我们在utils目录中创建一个dataTime.js文件

     文件写入函数

    export const getTimeLeft = function getTimeLeft(datetimeTo) {
      // 计算目标与现在时间差(毫秒)
      let time1 = datetimeTo;
      let time2 = new Date().getTime();
      if (time1 <= time2) return '(还剩0天0时0分处理)';
      let mss = time1 - time2;
      // 将时间差(毫秒)格式为:天时分秒
      let days = parseInt(mss / (1000 * 60 * 60 * 24));
      let hours = parseInt((mss % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
      let minutes = parseInt((mss % (1000 * 60 * 60)) / (1000 * 60));
      let seconds = parseInt((mss % (1000 * 60)) / 1000);
      return '(' + '还剩' + days + "天" + hours + "时" + minutes + "分" + seconds + '秒' + '处理' + ')'
    }
    

      在文件中引入这个函数

    import { getTimeLeft } from "../utils/dataTime.js";
    

      

    Page({
     data:{
       datetimeTo:"",
       timeLeft:""
    })
    

      

    当我们从接口拿到数据的时候,日期格式如果是 2020-02-31 15:06:57 这种格式的话 ,我们尽量不要用下面这种格式转换,有可能会导致转换之后的格式在ios上出现NAN天NAN时NAN分NAN秒的错误

     

     所以,我们可以换一种方法

      
    let arr = data.split(/[- :]/);
    let nndate = new Date(arr[0], arr[1] - 1, arr[2], arr[3], arr[4], arr[5]);
          nndate = Date.parse(nndate) //获取到的时间戳
    

      如果我们的倒计时是三天的话,七天或者是其他时间 就把 *3改变值就行

    var sevenDayLater = nndate * 1 + 86400 * 3 * 1000; //获取到的时间戳往后算三天时间
    this.setData({
    datetimeTo:sevenDayLater
    })

      当我们拿到三天后的时间戳,使用 setInterval() 与当前时间戳进行倒计时

      isTimeHandler(startTime) {
        this.data.timer = setInterval(() => {
          this.setData({
            timeLeft: getTimeLeft(this.data.datetimeTo)//使用了utils.getTimeLeft
          });
          if (this.data.timeLeft == "0天0时0分0秒") {
            clearInterval(this.data.timer);
          }
        }, 1000);
      },
    

      在页面引入这个参数值

    <text>{{timeLeft}}</text>
    

      

  • 相关阅读:
    POJ 2299 UltraQuickSort(求逆序数,归并排序或者离散化+树状数组)
    HDU 4349 Xiao Ming's Hope(数学题)
    HDU 2222 Keywords Search(AC自动机的入门题)
    HDU 4341 Gold miner(分组的背包问题)
    HDU 2825 Wireless Password(AC自动机+状态压缩DP)
    POJ 2352 Stars(树状数组)
    HDU 4342 History repeat itself(数学规律)
    HDU 4345 Permutation(数学题,记忆化搜索)
    HDU 3247 Resource Archiver(AC自动机+状态压缩DP)
    RFC
  • 原文地址:https://www.cnblogs.com/BySee1423/p/12559113.html
Copyright © 2020-2023  润新知