vue3写一个定时器

vue3没有this,取而代之的是proxy

所以在定时器的写法上也有所不同

话不多说直接上代码

<template>

<p>剩余时间:{{ count }}</p>

</template>

export default{

const seconds = ref(1800);//定义一下秒数,根据秒数来计算,需要自己判断

const countDown = () => {

let d = parseInt(seconds.value / (24 * 60 * 60));

d = d < 10 ? "0" + d : d;

let h = parseInt((seconds.value / (60 * 60)) % 24);

h = h < 10 ? "0" + h : h;

let m = parseInt((seconds.value / 60) % 60);

m = m < 10 ? "0" + m : m;

let s = parseInt(seconds.value % 60);

s = s < 10 ? "0" + s : s;

count.value = m + "分" + s + "秒";

// console.log('监听',count.value );

};

//

const timed = () => {

dsq.value = setInterval(() => {

seconds.value -= 1;

countDown();

}, 1000);

};

}

这样下来,一个倒计时30分钟的定时器就写好了

相关推荐
普通人63 小时前
Web端3D模型加载实战指南_Vue3_uni-app_HTML
前端·javascript·uni-app·html
志尊宝3 小时前
AI原生前端开发(042):AI辅助的路由设计与优化
javascript·react.js·ai-native
Dxy123931021613 小时前
JS DES 加密详解
开发语言·javascript·arcgis
充值内卷13 小时前
我给桌面加了个鱼缸:C++ 写后端,WebView2 里养一座 Three.js 小岛
开发语言·javascript·c++
椒哥16 小时前
一天被问几十次"允许",我统计了 517 次,然后写了个插件
前端·javascript·github
kyriewen16 小时前
我测了 6 种防请求竞态的写法:只有 1 种真能打
前端·javascript·程序员
OpsEye17 小时前
企业大模型压测,需要重点关注哪些指标?
javascript·ai编程
LuHang18 小时前
从天地图切换到高德地图:一次真实的底图迁移实战
前端·vue.js·cesium
像我这样帅的人丶你还18 小时前
我html生成的doc文档为何在手机文档显示不了图片?
前端·javascript
ruanno_top21 小时前
Vue 3 后台权限路由:我漏掉了按钮级裁剪,还把 403 写成了 404
vue.js