Tiny Timeago Component For Vue 3

Install & Download:

# Yarn
$ yarn add vue-timeago3
# NPM
$ npm i vue-timeago3

Description:

A tiny timeago component (a.k.a. human-readable relative time) for Vue 3 applications.

How to use it:

1. Import and register the timeago component.

import App from './App'
import { createApp } from 'vue'
import timeago from 'vue-timeago3'
const app = createApp(App)
app.use(timeago)
app.mount('#app')

2. Add the component to the template.

Now was: <timeago :datetime="date"/>

export default {
  data() {
    return {
      date: // Any Date
    }
  },
}

3. Available props.

datetime: {
  type: [String, Number, Date],
  required: true,
},
title: {
  type: [String, Boolean],
  required: false,
  default: null,
},
autoUpdate: {
  type: [Number, Boolean],
  required: false,
  default: null,
},
converter: {
  type: Function,
  required: false,
  default: null,
},
converterOptions: {
  type: Object as PropType<converterOptions>,
  required: false,
  default: null,
},
locale: {
  type: Object as PropType<Locale>,
  required: false,
  default: null,
},