vue中获取当前时间

最新推荐文章于 2024-08-15 14:01:50 发布

空那个白

最新推荐文章于 2024-08-15 14:01:50 发布

阅读量4.7k

点赞数 2

分类专栏：前端 vue

本文链接：https://blog.csdn.net/lucynie/article/details/103497367

版权

vue 同时被 2 个专栏收录

16 篇文章 1 订阅

订阅专栏

前端

9 篇文章 0 订阅

订阅专栏

vue组件（页面部分）

<template>
    <div class="monitor-time">
      {{nowTime}}
  </div>
</template>

方法调用
根据需要去调用方法
在data中定义nowTime:’’,

export default {
   data(){
       return {
          nowTime:'',
       }
   },
   mounted() {
     this.nowTimes();
   },
}

方法定义

nowTimes(){
      this.timeFormate(new Date());
      setInterval(this.nowTimes,1000);
      //this.clear()
    },
    //显示当前时间（年月日时分秒）
    timeFormate(timeStamp) {
      let year = new Date(timeStamp).getFullYear();
      let month =new Date(timeStamp).getMonth() + 1 < 10? "0" + (new Date(timeStamp).getMonth() + 1): new Date(timeStamp).getMonth() + 1;
      let date =new Date(timeStamp).getDate() < 10? "0" + new Date(timeStamp).getDate(): new Date(timeStamp).getDate();
      let hh =new Date(timeStamp).getHours() < 10? "0" + new Date(timeStamp).getHours(): new Date(timeStamp).getHours();
      let mm =new Date(timeStamp).getMinutes() < 10? "0" + new Date(timeStamp).getMinutes(): new Date(timeStamp).getMinutes();
      let ss =new Date(timeStamp).getSeconds() < 10? "0" + new Date(timeStamp).getSeconds(): new Date(timeStamp).getSeconds();
      let week = new Date(timeStamp).getDay();
      let weeks = ["日","一","二","三","四","五","六"];
      let getWeek = "星期" + weeks[week];
      this.nowTime = year + "年" + month + "月" + date +"日"+" "+hh+":"+mm+':'+ss+getWeek  ;
    },
    //clear(){
     // clearInterval(this.nowTimes)
     // this.nowTimes = null;
    //},

css部分（根据自己需要自定义即可）

.monitor-time{
    height:12px;
    float:right;
    margin:25px 15px 0 0 ;
    color:#27A5EA;
    font-size: 12px;
    font-family:FZLTCHK;
    line-height:27px;
  }