vue moment.js及實時更新當前時間

一、引入moment

1.安裝 cnpm install moment --save

2.import引入 import moment from 'moment'

3.設置moment區域為中國，引入：

import 'moment/locale/zh-cn'

moment.locale('zh-cn')

二、獲取當前時間

<div>{{nowtime | updatetime}}</div>
<script>
    export default{
        data(){
            return{
                nowtime:new Date()
            }
        },
        filters:{
            updatetime:function(value){
                return moment(value).format('LTS');
            }
        }
    }
</script>    

其中moment().format('LTS')獲取時間格式為：10:15:23類型

三、讓時間實時更新

讓時間實時更新用計時器，代碼如下

mounted(){//生命周期模板掛載之后
    let _this=this;
    this.timer=setInterval(()=>{
        _this.nowtime=new Date();
    },1000)
},
beforeDestroy(){//生命周期實例銷毀之前
    if(this.timer){
        clearInterval(this.timer);
    }
}  

這樣就可以實現時間實時更新啦