vue实例获取当前系统时间

vue实例获取当前系统时间

效果图:

 代码:

<template>
    <div class="home1-3-1 clearfix">
        <span>{{ nowDate }}</span>
        <p> <em>{{ nowYear }}.{{ nowMouth }}</em> <i>{{ nowWeek }}</i> </p>
    </div>
</template>  
<script>
export default {
    data () {
        return {
            nowYear: '',
            nowMouth: '',
            nowDate: '',
            nowWeek: ''
        }
    },
    mouted(){
        this.getdate()
   },
    methods:{
        getdate() {
        const year = new Date().getFullYear()
        const mounth = new Date().getMonth() + 1 < 10 ? '0' + (new Date().getMonth() + 1) : (new Date().getMonth() + 1)
        const date = new Date().getDate() < 10 ? '0' + new Date().getDate() : new Date().getDate()
        const week = new Date().getDay()
        if (week === 1) {
          this.nowWeek = '星期一'
        } else if (week === 2) {
          this.nowWeek = '星期二'
        } else if (week === 3) {
          this.nowWeek = '星期三'
        } else if (week === 4) {
          this.nowWeek = '星期四'
        } else if (week === 5) {
          this.nowWeek = '星期五'
        } else if (week === 6) {
          this.nowWeek = '星期六'
        } else if (week === 27) {
          this.nowWeek = '星期日'
        }
        this.nowYear = year
        this.nowMouth = mounth
        this.nowDate = date
      }
    }
}
</script>   

 

css样式我没有写,需要时分秒再通过其对应方法获取即可,年月日也可以进行拼接

posted @ 2020-07-21 16:16  麦麦兜兜儿  阅读(4414)  评论(0编辑  收藏  举报