vue-reactive-clock

1.0.6 • Public • Published

Vue reactive clock plugin

What is it good for ?

This plugin helps build time reactive UIs

A few examples where it might be useful :

  • If you want to display a clock that updates as time goes by
  • If you have a live dashboard with the current day's info, when passing to the next day, you'll want it to automatically update.

Usage:

Hook up the plugin to your Vue

 
import Clock from 'vue-reactive-clock'
 
Vue.use(Clock);
 

This will add a $clock property to your Vue which self updates.

It can be used directly in the templates ...

<template>
 <div>
    Today's date : {{ $clock.now | formatFilter }}
 </div>
</template>

You can use $clock programatically in your computed properties to have your UI update as time passes

computed: {
  isUrgent() {
    let d =  new Date(this.$clock.now);
    return d.getHours() > 18;
  }
}

Package Sidebar

Install

npm i vue-reactive-clock

Weekly Downloads

10

Version

1.0.6

License

ISC

Unpacked Size

2.35 kB

Total Files

3

Last publish

Collaborators

  • patrixr