You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
88 lines
1.7 KiB
88 lines
1.7 KiB
<template>
|
|
<text>{{dateShow}}</text>
|
|
</template>
|
|
|
|
<script>
|
|
import {friendlyDate} from './date-format.js'
|
|
/**
|
|
* Dateformat 日期格式化
|
|
* @description 日期格式化组件
|
|
* @tutorial https://ext.dcloud.net.cn/plugin?id=3279
|
|
* @property {Object|String|Number} date 日期对象/日期字符串/时间戳
|
|
* @property {String} locale 格式化使用的语言
|
|
* @value zh 中文
|
|
* @value en 英文
|
|
* @property {Array} threshold 应用不同类型格式化的阈值
|
|
* @property {String} format 输出日期字符串时的格式
|
|
*/
|
|
export default {
|
|
name: 'uniDateformat',
|
|
props: {
|
|
date: {
|
|
type: [Object, String, Number],
|
|
default () {
|
|
return '-'
|
|
}
|
|
},
|
|
locale: {
|
|
type: String,
|
|
default: 'zh',
|
|
},
|
|
threshold: {
|
|
type: Array,
|
|
default () {
|
|
return [0, 0]
|
|
}
|
|
},
|
|
format: {
|
|
type: String,
|
|
default: 'yyyy/MM/dd hh:mm:ss'
|
|
},
|
|
// refreshRate使用不当可能导致性能问题，谨慎使用
|
|
refreshRate: {
|
|
type: [Number, String],
|
|
default: 0
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
refreshMark: 0
|
|
}
|
|
},
|
|
computed: {
|
|
dateShow() {
|
|
this.refreshMark
|
|
return friendlyDate(this.date, {
|
|
locale: this.locale,
|
|
threshold: this.threshold,
|
|
format: this.format
|
|
})
|
|
}
|
|
},
|
|
watch: {
|
|
refreshRate: {
|
|
handler() {
|
|
this.setAutoRefresh()
|
|
},
|
|
immediate: true
|
|
}
|
|
},
|
|
methods: {
|
|
refresh() {
|
|
this.refreshMark++
|
|
},
|
|
setAutoRefresh() {
|
|
clearInterval(this.refreshInterval)
|
|
if (this.refreshRate) {
|
|
this.refreshInterval = setInterval(() => {
|
|
this.refresh()
|
|
}, parseInt(this.refreshRate))
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|
|
|