Applet countdown time format

We do a lot of the time there will be a countdown style, there are seconds of the countdown, minutes, hours, days and how many have been countdown

So, I summed up a countdown of how many days demo;

 

 

We create a dataTime.js file in the directory utils

 File write function

export const getTimeLeft = function getTimeLeft(datetimeTo) {
  // Now calculate the target time difference (ms)
  let time1 = datetimeTo;
  let time2 = new Date().getTime();
  if (time1 <= time2) return '(0 days remaining process 0:00)';
  let mss = time1 - time2;
  // time difference (msec) in the format: minutes and seconds days
  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 '(' + 'left' + days + "days" + hours + "when" + minutes + "min" + seconds + 's' + 'treatment' + ')'
}

  The introduction of this function in the file

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

  

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

  

When we get the data from the interface, if the date format is 2020-02-31 15:06:57 this format, we try not to use the following format conversion, may lead on ios format after conversion NAN NAN second minute when an error occurs NAN NAN days

 

 

 

 So, we can change a way

  
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) // acquired timestamp

  If we countdown three days, then seven days or other times * 3 to change the value put on the line

var sevenDayLater = nndate * 1 + 86400 * 3 * 1000; // count the acquired timestamp next three days 
this.setData ({
datetimeTo: sevenDayLater
})

  When we get a time stamp after three days, using setInterval () is counting down and the current timestamp

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

  The introduction of this parameter in the page

 

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

  

 

 

Guess you like

Origin www.cnblogs.com/BySee1423/p/12559113.html