A timeago component Vue.js
$ npm install --save vue-timeagoIt's also available on NPMCDN: https://unpkg.com/vue-timeago/
import VueTimeago from 'vue-timeago'
Vue.use(VueTimeago, {
name: 'timeago', // component name, `timeago` by default
locale: 'en-US',
locales: {
// you will need json-loader in webpack 1
'en-US': require('vue-timeago/locales/en-US.json')
}
})Then in your lovely component:
<!-- simple usage -->
<!-- time is a dateString that can be parsed by Date.parse() -->
<timeago :since="time"></timeago>
<!-- Auto-update time every 60 seconds -->
<timeago :since="time" :auto-update="60"></timeago>
<!-- max time, time before this will not be converted -->
<!-- instead you can use a custom formatTime function to format -->
<!-- 86400 * 365 = a year -->
<timeago :since="time" :max-time="86400 * 365" :format="formatTime"></timeago>
<!-- custom locale -->
<!-- use a different locale instead of the global config -->
<timeago :since="time" locale="zh-CN"></timeago>A very basic demo: https://egoistian.com/vue-timeago
For all supported languages, see /locales, it's easy to add a new language support, feel free to submit a Pull Request to help us support more languages!
Type: string (dateString)
Required: true
String value representing a date. The string should be in a format recognized by the Date.parse() method. see more at MDN
Type: number
Default: 86400 * 365 (a year)
The max time in seconds, time before this will not be converted.
Type: function
Default: see below
The function we use to format the time before max-time, default function:
// `time` is returned by `new Date(since).getTime()`
function formatTime(time) {
const d = new Date(time)
return d.toLocaleString()
}Type: number
The period to update the component, in seconds.
You can set it to 0 to disable auto-update.
Type: string
Specific a locale for relavant component only.
# for dev
$ npm run example
# for publishing
$ npm run buildMIT © EGOIST