Bootstrap

vue 倒计时 天:时:分:秒


```javascript
<template>
  <div class="position_list">
    <p>距离2020年除夕夜还剩{{time.D}}天{{time.h}}时{{time.m}}分{{time.s}}秒</p>
  </div>
</template>
<script>
export default {
  name: "position_list",
  data() {
    return {
      time: {
        D: "",
        h: "",
        s: "",
        m: ""
      },
      isEnd: false,
      endTime: "2020-01-24 00:00:00"
    };
  },
  created() {
    let that = this;
    that.setEndTime();
  },
  methods: {
    setEndTime() {
      let that = this;
      let interval = setInterval(function timestampToTime() {
        var date = new Date(that.endTime) - new Date(); //计算剩余的毫秒数
        if (date < 0) {
          that.isEnd = true;
          that.time = {
            D: "00",
            h: "00",
            s: "00",
            m: "00"
          };
          clearInterval(interval);
        } else {
          that.time.D = parseInt(date / 1000 / 60 / 60 / 24, 10); //计算剩余的天
          if (that.time.D < 10) {
            that.time.D = "0" + that.time.D;
          }
          that.time.h = parseInt((date / 1000 / 60 / 60) % 24, 10); //计算剩余的小时
          if (that.time.h < 10) {
            that.time.h = "0" + that.time.h;
          }
          that.time.m = parseInt((date / 1000 / 60) % 60, 10); //计算剩余的分钟
          if (that.time.m < 10) {
            that.time.m = "0" + that.time.m;
          }
          that.time.s = parseInt((date / 1000) % 60, 10); //计算剩余的秒数
          if (that.time.s < 10) {
            that.time.s = "0" + that.time.s;
          }
          return that.time.D + that.time.h + that.time.m + that.time.s;
        }
      }, 1000);
    }
  }
};
</script>
<style lang="less" scoped>
.position_list {
  width: 100%;
  height: 100%;
}
</style>

;