(九)vue定时setInterval与延迟setTimeout
定时函数setInterval,销毁定时clearTimeout。如页面没隔10s从后台获取下当前时间<template><div>时间{{timeStr}}</div></template><script>import { getTime } from "@/api/test";export default {...
·
一、定时函数setInterval,销毁定时clearTimeout。
如页面没隔10s从后台获取下当前时间
<template>
<div>时间{{timeStr}}</div>
</template>
<script>
import { getTime } from "@/api/test";
export default {
data() {
return {
timeStr: "",
timer: "" // 定时器
};
},
mounted() {
this.timer = setInterval(this.getCuTime, 10 * 1000);
},
methods: {
getCuTime() {
getTime()
.then(res => {
this.timeStr = res.data;
})
.catch(err => {
console.log(err);
});
}
},
beforeDestroy() {
clearTimeout(this.timer);
},
// watch: {
// "this.timeStr": {
// handler(val) {}
// }
// }
};
</script>
<style scoped>
</style>
@RequestMapping("/timer")
public ResponseMessage timerTest(){
Date date = new Date();
SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy-MM-dd hh:mm:ss");
String dateStr = simpleDateFormat.format(date);
System.out.println("请求时间:"+dateStr);
return ResponseMessage.success(CommonEnums.CODE_200.code,CommonEnums.CODE_200.message,dateStr);
}
二、延迟函数setTimeout:
//延迟500毫秒执行
setTimeout(function () {
//你的逻辑
}, 500);
});
更多推荐
已为社区贡献15条内容
所有评论(0)