vue3 倒计时3秒后返回首页

效果

代码实现

<template>
{{ count }}秒后返回网站首页 <br>
</template>

<script lang="ts">
import router from "/@/router";
import {onMounted, reactive, ref} from "vue";

export default {
  setup(): any {
    onMounted(() => {
      countdown()  //页面一加载成功就执行
    })

    let timer = null
    let count: number = ref(10)

    //倒计时
    function countdown() {
      timer = setInterval(() => {
        count.value = count.value-1
        if (count.value <= 0) {
          clearInterval(timer);
          timer = null;
          //跳转的页面写在此处
          router.push({path: "/"}); // 强制切换当前路由 path
        }
      }, 1000)
    }

    return {
      count
    }
  }
}
</script>

标签：count,timer,onMounted,value,倒计时,首页,vue3,router,null
来源： https://blog.csdn.net/lianghecai52171314/article/details/116901944