Ask Your Question

Revision history [back]

click to hide/show revision 1
initial version

Yes, Vue.js can be set up to automatically refresh time by using the setInterval() method to update the time every second or any other set interval. Here's an example:

In your Vue component template, add a span tag with an id of "current-time":

<template>
  <div>
    <p>Current Time:</p>
    <span id="current-time">{{ currentTime }}</span>
  </div>
</template>

In the script section of your component, define a data property currentTime and use the setInterval() method to update it every second:

<script>
export default {
  data() {
    return {
      currentTime: null
    }
  },
  mounted() {
    setInterval(() => {
      this.currentTime = new Date().toLocaleTimeString();
    }, 1000);
  }
}
</script>

When the component is mounted, the setInterval() method will be called and the currentTime property will be updated every second. The time will automatically refresh in the HTML template due to Vue's reactive nature.