vue如何暂停setinterval
时间: 2023-09-10 19:13:05 浏览: 249
在Vue中暂停setInterval可以通过以下步骤实现:
1. 在Vue组件中声明一个变量用于存储setInterval的返回值,例如`timer`。
2. 在需要暂停setInterval的地方,使用`clearInterval(timer)`来清除定时器。
3. 在需要重新启动setInterval的地方,重新调用`setInterval`并将返回值赋值给`timer`。
下面是一个示例代码:
```vue
<template>
<div>
<button @click="startInterval">Start Interval</button>
<button @click="pauseInterval">Pause Interval</button>
</div>
</template>
<script>
export default {
data() {
return {
timer: null
};
},
methods: {
startInterval() {
this.timer = setInterval(() => {
console.log('Interval running...');
}, 1000);
},
pauseInterval() {
clearInterval(this.timer);
}
}
};
</script>
```
在上面的示例中,点击"Start Interval"按钮将启动一个每秒执行一次的定时器,并将返回的定时器ID存储在`timer`变量中。点击"Pause Interval"按钮将清除定时器,实现了暂停功能。
阅读全文