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分钟的定时器就写好了

相关推荐
用户69190268133913 小时前
Harness工程的概念,以及简单的代码示例
javascript·架构
AI_paid_community13 小时前
如何使用 Claude 在 AI 时代快速入局新的行业?(经验贴)
前端·javascript·后端
sunly_13 小时前
React Suspense 用法详解
前端·javascript·react.js
渣波13 小时前
TS 必考题深度解析:type 与 interface 的终极对决
前端·javascript
必须会一定会15 小时前
用纯 HTML/JS 做一个 AI 需求澄清器:把模糊想法转换成可执行任务书
开发语言·前端·javascript·人工智能·html·ai编程
小帅不太帅15 小时前
1.5M 参数的 OCR 模型,我把它跑进了浏览器
前端·javascript·ai编程
Sterting16 小时前
Element-Plus 入门与整体布局
前端·vue.js·elementui
avi91111 天前
[AI教做人]AI平台做2项目;一个3D模型展示,另一个框架多人
javascript·人工智能·ai·3d模型·3d引擎·顶点和法线
kyriewen1 天前
我用Claude Code两天干完了团队两周的排期——周报发出去那一刻我就后悔了
前端·javascript·ai编程
用户938515635071 天前
手写一个 LLM Harness 框架:用工程化手段把大模型幻觉踩在脚下
javascript·人工智能·后端