Vue-crono Example

by brianrosamilia

HTML

<script src="https://unpkg.com/vue-crono@1.0.2/dist/index.js"></script>
<div id="app">
 <h2>
 The current time is: {{time}}
 </h2>
</div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  width:50%;
  text-align:center;
}

h2 {
  font-weight: bold;
  margin-bottom: 15px;
}

Vue

// Script included from https://unpkg.com/vue-crono@1.0.4/dist/index.js

Vue.use(window.crono);

new Vue({
  el: "#app",
  data: {
    time: undefined
  },
  methods:{
    load(){
        this.time = (new Date().toLocaleTimeString());
    }
	},
  mounted(){
      this.load();
  },
  cron:{
      time: 1000,
      method: 'load'
  }
});