vue3 使用计时器 setInterval

在Vue3中，使用计时器setInterval可以通过在组件的methods中定义一个函数，并在该函数中使用setInterval函数来实现。具体步骤如下：
1. 在组件的data选项中定义一个变量，用于存储计时器的ID。
2. 在组件的methods选项中定义一个函数，用于启动计时器。在该函数中使用setInterval函数来创建计时器，并将计时器的ID存储到步骤1中定义的变量中。
3. 在组件的methods选项中定义一个函数，用于停止计时器。在该函数中使用clearInterval函数来清除计时器，并将步骤1中定义的变量设置为null。

下面是一个示例代码：

<template>
  <div>
    <p>{{ count }}</p>
    <button @click="startTimer">Start Timer</button>
    <button @click="stopTimer">Stop Timer</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      timerId: null,
      count: 0
    };
  },
  methods: {
    startTimer() {
      this.timerId = setInterval(() => {
        this.count++;
      }, 1000);
    },
    stopTimer() {
      clearInterval(this.timerId);
      this.timerId = null;
    }
  }
};
</script>