zoukankan      html  css  js  c++  java
  • 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样式我没有写,需要时分秒再通过其对应方法获取即可,年月日也可以进行拼接

  • 相关阅读:
    Shell学习笔记 ——第一天
    Myclipse 安装 Maven遇见的N个异常
    Myeclipse 创建 Web Maven项目
    Guava API
    String 转Map(基于Guava类库)
    Mybatis——helloWorld级程序
    redis
    listener、context、filter、servlet及其加载顺序
    junit 单元测试
    hibernate —— 树状存储
  • 原文地址:https://www.cnblogs.com/Maipocket-y/p/13355721.html
Copyright © 2011-2022 走看看