小程序时间格式倒计时

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

所以，总结了一个还有多少天倒计时的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>

小程序时间格式倒计时

猜你喜欢