• 时间类库的引入使用


    <template>
    <div>
    <div class="timeFont">{{result}}</div>
    <h1>{{Date.now()|date}}</h1>
    </div>
    
    </template>
    <script>
    import moment from 'moment'
    import 'moment/locale/zh-cn'
    moment.locale('zh-cn')
    export default {
      name:'test',
      data () {
          return {
              result:'',
              week:'',
              arr_week:['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday']
          }
      },
      methods:{
          timeFilter:function(t){
           if(t<=9){
               return '0'+t
           }else{
               return t
           }
          }
      },
      filters:{
          date(val){
           return moment(val).calendar()
          }
      },
      created () {
          var that=this;
          setInterval(function(){
              var time=new Date();
              var year=time.getFullYear();
              var month=time.getMonth()+1;
              var day=time.getDate();
              var hour=time.getHours();
              var minutes=time.getMinutes();
              var second=time.getSeconds();
              var weeks=time.getDay();
              that.week=that.arr_week[+weeks];
              that.result=`${year}/${that.timeFilter(month)}/${that.timeFilter(day)}   ${that.timeFilter(hour)}:${that.timeFilter(minutes)}:${that.timeFilter(second)}  ${that.week}`
          },1000)
      }
      
    }
    </script>
    <style>
    
    </style>
    

    npm i comment -s下载

    局部模板引入,并设置为中国当地时间

    编写过滤器,并对时间过滤

    自己写的简单时钟

      

    日期格式化
    moment().format('MMMM Do YYYY, h:mm:ss a'); // 十一月 6日 2017, 5:45:04 下午
    moment().format('dddd');                    // 星期一
    moment().format("MMM Do YY");               // 11月 6日 17
    moment().format('YYYY [escaped] YYYY');     // 2017 escaped 2017
    moment().format();                          // 2017-11-06T17:45:04+08:00
    相对时间
    moment("20111031", "YYYYMMDD").fromNow(); // 6 年前
    moment("20120620", "YYYYMMDD").fromNow(); // 5 年前
    moment().startOf('day').fromNow();        // 18 小时前
    moment().endOf('day').fromNow();          // 6 小时内
    moment().startOf('hour').fromNow();       // 1 小时前
    日历时间
    moment().subtract(10, 'days').calendar(); // 2017年10月27日
    moment().subtract(6, 'days').calendar();  // 上周二下午5点45
    moment().subtract(3, 'days').calendar();  // 上周五下午5点45
    moment().subtract(1, 'days').calendar();  // 昨天下午5点45分
    moment().calendar();                      // 今天下午5点45分
    moment().add(1, 'days').calendar();       // 明天下午5点45分
    moment().add(3, 'days').calendar();       // 本周四下午5点45
    moment().add(10, 'days').calendar();      // 2017年11月16日
    多语言支持
    moment().format('L');    // 2017-11-06
    moment().format('l');    // 2017-11-06
    moment().format('LL');   // 2017年11月6日
    moment().format('ll');   // 2017年11月6日
    moment().format('LLL');  // 2017年11月6日下午5点45分
    moment().format('lll');  // 2017年11月6日下午5点45分
    moment().format('LLLL'); // 2017年11月6日星期一下午5点45分
    moment().format('llll');
  • 相关阅读:
    js 字符串操作函数
    loadscript加载
    jquery.cookie.js结合asp.net实现最近浏览记录
    .net 关于匿名类型的特性
    高级javaScript程序形成过程(进阶)
    javascript window.*
    Jquery遍历筛选数组的几种方法和遍历解析json对象|Map()方法详解
    javascript prototype
    Jquery 中的CheckBox、 RadioButton、 DropDownList的取值赋值
    jquery笔记
  • 原文地址:https://www.cnblogs.com/douyaer/p/7794337.html
Copyright © 2020-2023  润新知