Vue 使用 `setInterval` 函数来周期性地调用一个方法

在 Vue 中，可以使用 `setInterval` 函数来周期性地调用一个方法。以下是一个简单的例子：

<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>

在上面的例子中，我们使用了 `mounted` 钩子函数来在组件挂载后调用 `setInterval` 函数。`setInterval` 函数会每隔一段时间调用 `incrementCounter` 方法，这里设置为每隔1秒钟。

`incrementCounter` 方法将 `counter` 的值自增1。每次调用该方法时，Vue会自动更新模板上 `counter` 绑定的文本内容。这样，每隔一段时间就会更新一次 `counter` 的值，从而实现周期性的调用方法。

有用请点赞，养成良好习惯！

疑问、交流、鼓励请留言！