[JavaScript知识库]vue封装年月日时分秒

<template>
  <div>
      <div >
      <p v-html="formateTimeStamp(date)"></p>
    </div>
  </div>
</template>

<script>
export default {
   data: function () {
    return {
      date: new Date().getTime()
    }
  },
  mounted: function () {

  },
  created: function () {
    this.loadTime()
  },
  methods: {
    loadTime() {
      var _this = this;
      setInterval(() => {
        _this.date += 1000;
      }, 1000);
    },
    // 转换时间戳
    formateTimeStamp(time) {
      var date = new Date(time);
      var year = date.getFullYear();
      var month =
        date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1;
      var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
      var minute =
        date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
      var second =
        date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
      var week = ["日", "一", "二", "三", "四", "五", "六"][date.getDay()];
      return (
        '<span style="font-size: 18px;">' +
        hour +
        ":" +
        minute + ":" + second +
        "</span><br/>" +
        year +
        "年" +
        month +
        "月" +
        day +
        "日" +
        "   星期" +
        week
      );
    },
}
}
</script>

<style>

</style>