<template>
<div class="mydate">
{{date|formatDate(this)}}
</div>
</template>
<script>
export default{
data(){
return{
date:new Date(
<template>
<div class="mydate">
{{date|formatDate(this)}}
</div>
</template>
<script>
export default{
data(){
return{
date:new Date()
}
},
methods:{
padDate(value){
return value<10?"0"+value:value
},
},
filters:{
formatDate(value,vue){//value需要过滤的数据
var date = new Date(value);
var year = date.getFullYear();
var month = vue.padDate(date.getMonth()+1);
var day = vue.padDate(date.getDate());
var hours = vue.padDate(date.getHours());
var minutes = vue.padDate(date.getMinutes());
var seconds = vue.padDate(date.getSeconds());
return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
}
},
mounted(){
this.timer = setInterval(()=>{
this.date = new Date();
},1000);
},
beforeDestory(){
if(this.timer){
clearInterval(this.timer);//在vue实例销毁前,清除我们的定时器
}
}
}
</script>
</script>
<style>
</style>
)
}
},
methods:{
padDate(value){
return value<10?"0"+value:value
},
},
filters:{//filters指向window而不是vue,所以要将vue作为参数传进来才能调用methods中的方法
formatDate(value,vue){//value需要过滤的数据
var date = new Date(value);
var year = date.getFullYear();
var month = vue.padDate(date.getMonth()+1);
var day = vue.padDate(date.getDate());
var hours = vue.padDate(date.getHours());
var minutes = vue.padDate(date.getMinutes());
var seconds = vue.padDate(date.getSeconds());
return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
}
},
mounted(){
this.timer = setInterval(()=>{
this.date = new Date();
},1000);
},
beforeDestory(){
if(this.timer){
clearInterval(this.timer);//在vue实例销毁前,清除我们的定时器
}
}
}
</script>
</script>
<style>
</style>