Vue uses the `setInterval` function to periodically call a method

In Vue, you can use the `setInterval` function to call a method periodically. Here is a simple example:

<template>
  <div>
    <h1>{
   
   { counter }}</h1>
  </div>
</template>

<script>
export default {
  data() {
    return {
      counter: 0
    };
  },
  mounted() {
    setInterval(this.incrementCounter, 1000); // 每1000毫秒(即1秒)调用incrementCounter方法
  },
  methods: {
    incrementCounter() {
      this.counter++;
    }
  }
};
</script>

In the above example, we used the `mounted` hook function to call the `setInterval` function after the component is mounted. The `setInterval` function will call the `incrementCounter` method every once in a while, here it is set to every 1 second.

The `incrementCounter` method increments the value of `counter` by 1. Every time this method is called, Vue will automatically update the text content bound to `counter` on the template. In this way, the value of `counter` will be updated every once in a while, so as to realize the periodic calling method.

Please like it if it is useful, and develop a good habit!

Please leave a message for questions, exchanges, and encouragement!

Guess you like

Origin blog.csdn.net/libusi001/article/details/131189987