<template>
  <div>
    <div>{{ countDown }}</div>
    <div>{{ message }}</div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      countDown: 300, // 倒计时初始值为300秒(5分钟)
      intervalId: null, // setInterval 的返回值
      message: '轮询中...', // 轮询状态提示信息
    };
  },
  created() {
    // 创建轮询
    this.intervalId = setInterval(() => {
      if (this.countDown > 0) {
        this.countDown--;
      } else {
        clearInterval(this.intervalId); // 倒计时结束,清除轮询
        this.message = '轮询结束'; // 修改轮询状态提示信息
      }
    }, 3000); // 每隔3秒钟执行一次轮询
  },
  beforeDestroy() {
    clearInterval(this.intervalId); // 组件销毁前清除轮询
  },
};
</script>
Vue 实现三秒一次、五分钟结束的轮询

原文地址: https://www.cveoy.top/t/topic/lpNY 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录