在vue中如何实现当前时间？（年，月，日，周，时，分，秒）

效果如下： 

源码如下 ：

<template>
  <p>
    <span>{{ NowTime }}</span>
  </p>
</template>
<script>
export default {
  data() {
    return {
      NowTime: "",
    };
  },
  methods: {
    nowTime() {
      var d = new Date();
      var _year = d.getFullYear();
      var _month = d.getMonth();
      var _date = d.getDate();
      var _week = d.getDay();
      var _h = d.getHours();
      var _m = d.getMinutes();
      var _s = d.getSeconds();
      var week = [
        "星期日",
        "星期一",
        "星期二",
        "星期三",
        "星期四",
        "星期五",
        "星期六"
      ];
      var y = _year + "年" + (_month + 1) + "月" + _date + "日" + "   ";
      var w = week[_week] + "   ";
      var h =
        this.changeNum(_h) +
        ":" +
        this.changeNum(_m) +
        ":" +
        this.changeNum(_s);
      this.NowTime = y + w + h;
    },
    getTime() {
      var _this = this;
      setInterval(function () {
        _this.nowTime();
      }, 1000);
    },
    changeNum(num) {
      return num >= 10 ? num : "0" + num;
    },
  },

  mounted() {
    this.getTime();
  },
};
</script>
<style scoped>
p {
  text-align: center;
  margin: 3vh 0 2vh 0;
  color: burlywood;
  font-size: 30px;
}
</style>

以上代码就能实现可视化大屏或者某个页面的当前时间的实现，再根据具体需求修改样式。