vue 定时器

在 Vue 中，可以使用 setInterval() 和 setTimeout() 函数来设置定时器。

使用 setInterval() 函数设置定时器：

var timer = setInterval(function() {
  // 定时执行的代码
}, 时间间隔);

其中，第一个参数是定时执行的代码，第二个参数是时间间隔，单位是毫秒。

使用 setTimeout() 函数设置定时器：

var timer = setTimeout(function() {
  // 定时执行的代码
}, 时间间隔);

其中，第一个参数是定时执行的代码，第二个参数是时间间隔，单位是毫秒。

在 Vue 中使用定时器需要注意以下事项：

定时器应该在组件销毁时清除，以避免内存泄漏。
在 Vue 中，不要直接修改定时器变量的值，否则会影响定时器的执行。
在 Vue 中，不要在定时器中直接操作 DOM，应该使用数据驱动视图的方式进行操作。

下面是一个使用 setInterval() 函数设置定时器的示例：

<template>
  <div>
    <p>{{ message }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: '定时器开始执行'
    }
  },
  mounted() {
    this.timer = setInterval(() => {
      this.message = '定时器执行了一次'
    }, 1000)
  },
  beforeDestroy() {
    clearInterval(this.timer)
  }
}
</script>

在这个示例中，首先在组件的 data 中定义了一个 message 变量，用于显示定时器的执行情况。

在组件的 mounted 钩子函数中，使用 setInterval() 函数设置了一个每隔一秒钟执行一次的定时器，并且将定时器的 ID 保存在组件的 timer 变量中。

在组件的 beforeDestroy 钩子函数中，调用 clearInterval() 函数清除定时器，以避免内存泄漏