最近项目上有个需求,当复制功能成功后,要求弹出提示信息。定的策略是 5秒轮询一次 是否有复制任务,如果有则根据返回的状态为true去请求消息接口,多条 的时候,要求 一秒弹出一条**提示信息,并且无论是否有消息都会再去请求是否有赋值任务接口。
其中就用到了setTimeout和setInterval,一开始觉得还挺更简单的,但是开发完测试的时候发现可能会存在本来应该5秒一次发送请求,变得越来越快,后来甚至一秒一次的情况。
附上代码:
getCopyTaskMessages(val) {
getTasksMessages({
itemsPerPage: 100,
page: 1,
type: '',
status: 'WAITING_NOTIFIED'
}).then(res => {
if (res.data.status) {
const arr = res.data.items;
let list = [];
if (arr.length <= 3) {
arr.forEach(item => {
list.push({
title: `${item.type === 'COPY_COURSE_DESIGN' ? '课程' : '课堂'}设计${item.jumpType === 'CD' && item.type === 'COPY_CLAZZ_DESIGN' ? '批量' : ''}复制${item.taskStatus === 'DONE' ? '成功' : '失败'}`,
text: item.title,
type: item.taskStatus === 'DONE' ? 'success' : 'error',
data: {
type: 0,
jumpPath: {
name: item.jumpType === 'ZD' && item.type === 'COPY_CLAZZ_DESIGN' ? 'ClazzDesignDetailEdit' : 'CourseDesignDetailEdit',\
params: {
oid: item.jumpOid\
query: {
title: item.title,
tab: item.jumpType === 'CD' && item.type === 'COPY_CLAZZ_DESIGN' ? 3 : 0
jumpOid: item.jumpOid,
btnText: item.taskStatus === 'DONE' ? "查看" : '',
borderColorClass: item.taskStatus === 'DONE' ? "border-green" : 'border-red',
} else {
list.push({
title: `你发起的${arr.length}个复制任务已完成`,
text: '任务中心',
type: 'success',
data: {
type: 1,
btnText: '',
borderColorClass: "border-green",
let i = 0;
this.$notify(list[i]);
this.notifyTimer = setInterval(() => {
i++;
this.$notify(list[i]);
if (i >= list.length) {
clearInterval(this.notifyTimer);
}, 1000);
this.checkTask();
checkTask() {
getTasksNotify().then(res => {
if (res.data.status) {
this.timer = setTimeout(() => {
this.getCopyTaskMessages();
}, 5000);
} else {
clearTimeout(this.timer);
this.timer = null;
clearInterval(this.notifyTimer);
this.notifyTimer = null;
后来有在网上查一下,发现可能是因为计时器调用后没有清理,导致下一次又创建了一个计时器,重复几次就会有多个相同的计时器已经被创建,就会产生越来越快的情况。
最后尝试每次请求是否有复制任务接口之前清空计时器,就ok了!
checkTask() {
etTasksNotify().then(res => {
if(this.timer) clearTimeout(this.timer;
if (res.data.status) {
this.timer = setTimeout(() => {
this.getCopyTaskMessages();
}, 5000);
clearInterval(this.notifyTimer);
this.notifyTimer = null;
复制代码