前言由于业务需要，需要在封装的弹窗组件中引入一个定时器来实现倒计时的效果，但是如果有两个弹窗同时触发，会造成timerbug，上一个弹窗的timer还没有清零，倒计时会错乱。这时候想到的解决方案就是使用队列方式，将每个需要的弹窗存储在队列中，一个一个显示弹窗，同时清空Timer什么是队列Queue(Queue)是一个先进先出(FIFO，First-In-First-Out)的线性表。在具体应用中，通常用链表或数组来实现。队列只允许在尾部插入（enqueue），在头部删除（dequeue）。队列的运行方式和栈类似，唯一不同的是队列只允许在后端加入新的数据。JavaScript实现队列函数ArrayQueue(){vararr=[];//入口操作this.push=function(element){arr.push(element);返回真；}//退出操作this.pop=function(){returnarr.shift();}//获取队长this.getFront=function(){returnarr[0];}//获取队尾this.getRear=function(){returnarr[arr.length-1]}//清空队列this.clear=function(){arr=[];}//获取船长this.size=function(){returnlength;}}首先要做vue封装的弹窗组件配合待修改的组件封装队列classQueue{dataStore=[]constructor(){this.dataStore=[]}enqueue(e){this.dataStore.push(e)console.warn('enqueue',this.dataStore);}dequeue(){this.dataStore.shift()console.warn('dequeue',this.dataStore);}front(){console.log(this.dataStore,'front')returnthis.dataStore[0]()}select(){返回这个。数据存储[0]}返回（){returnthis.dataStore[this.dataStore.length-1]}isEmpty(){if(this.dataStore.length==0){returntrue}returnfalse}toString(){returnthis.dataStore.join(',')}}exportdefaultQueue需要在弹出第一个队列时自行执行。在你封装组件的函数中引入这个队列，同时实例化这个队列，写两个方法。constpushDialog=(eventName)=>{if(queue.isEmpty()){queue.enqueue(eventName);打开对话框（）；}else{queue.enqueue(eventName);}}constopenDialog=()=>{//打开弹窗queue.front();}在安装方法中将每个弹窗添加到队列中。需要注意的是每次弹窗都要销毁，否则会重复该方法。比如确定方法和定时器后如何出队和清除定时器
