我有一个简单的弹出通知组件，应在4秒钟后隐藏（不透明度：0）。问题是，如果我触发使通知出现并随后在4秒钟后消失的事件，我希望保留该通知。现在一切正常，但是setTimeout（）相互堆叠，我只希望最后一个setTimeout（）触发，如何实现呢？
所以基本上我希望我的通知在发出事件的按钮被单击时保持可见，并且只有在最后一次单击时，setTimeout（）才应触发。
这是我有问题的代码：
showNotification(v){
this.popupProduct = v;
this.showPopup = true;
setTimeout(()=>{
console.log(this.showPopup)
this.showPopup = false;
},4000)
},
通知的显示由this.showPopup哪个存储在Vue数据对象中决定。
一种方法是存储超时的id并在函数开始时将其清除：
showNotification(v) {
if (this.timeoutId) {
clearTimeout(this.timeoutId)
this.timeoutId = undefined
}
this.popupProduct = v;
this.showPopup = true;
this.timeoutId = setTimeout(()=>{
console.log(this.showPopup)
this.showPopup = false;
},4000)
},
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句