时间格式化的封装
<template>
<span>
<span v-if="(dateValue)?true:false">
<span v-show="dateShow">
{{new Date(dateValue).getFullYear()}}{{(timeTypeChina===true)?"年":'-'}}{{(new Date(dateValue).getMonth()+1 < 10 ? '0'+(new Date(dateValue).getMonth()+1) : new Date(dateValue).getMonth()+1)}}{{(timeTypeChina===true)?"月":'-'}}{{(new Date(dateValue).getDate()+1 < 10 ? '0'+(new Date(dateValue).getDate()) : new Date(dateValue).getDate())}}{{(timeTypeChina===true)?"日":''}}
</span>
<span v-show="timeShow">
{{
(new Date(dateValue).getHours()< 10 ? '0'+(new Date(dateValue).getHours()) : new Date(dateValue).getHours())+':'+
(new Date(dateValue).getMinutes() < 10 ? '0'+(new Date(dateValue).getMinutes()) : new Date(dateValue).getMinutes())+':'+
(new Date(dateValue).getSeconds() < 10 ? '0'+(new Date(dateValue).getSeconds()) : new Date(dateValue).getSeconds())
}}</span>
</span>
</span>
</template>
<script>
export default {
data() {
return {
dateValue:null,
}
},
props:{
date:{
default:0,
},
timeShow:{
default:false,
},
dateShow:{
default:true,
},
timeTypeChina:{
default:false,
},
},
created(){
this.dateValue=Number(this.date)
},
watch: {
date() {
this.dateValue = Number(this.date)
},
},
methods:{
},
}
</script>
<style>
</style>
调用。。。。。
1、页面引入组件
import dateView from "./../views/date-view.vue";
components: {"date-view": dateView},
直接引用就行了 :data是yyyy-mm-dd :timeShow 是yyyy-mm-dd +时分秒
<date-view :date="item.createdTime"></date-view>