<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下載javascript
局部模板引入,並設置爲中國當地時間java
編寫過濾器,並對時間過濾npm
本身寫的簡單時鐘this
日期格式化 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');