Javascript 可观测任务队列

我有这样的情况：我的应用程序的用户可以点击一个按钮来执行一个任务，任务需要2秒钟才能完成。我想创建一个队列，按顺序执行一行中的每个任务

我用的是离子3和打字脚本

---

最好的方法是什么？

我只需抓取按钮的引用，订阅点击事件流，然后使用

flatMap

将点击事件传递给执行任务的任何异步函数。RxJS将确保一切按顺序执行，Rx的美妙之处在于您不必管理任何状态

例如：

ionViewDidLoad() {
  // grab a reference to your button.  Doesn't matter how you do it.
  const button = document.getElementById('queueEventButton')

  // Create the stream of clicks
  Observable.fromEvent(button, 'click')
    .flatMap(this.doTask) // pass each click event off to the async process
    .scan( (count: number) => count + 1, 0) // this just counts the mouse click, useful for example
    .subscribe(count => console.log(`Response received for button click #${count}!`))
}

// example task that simulates two second processing
doTask(event: Event): Observable<Event> {
  return Observable.fromPromise(new Promise(resolve => {
    setTimeout(() => resolve(event), 2000)
  }))
}

ionViewDidLoad（）{
//抓取一个按钮的引用。不管你怎么做。
const button=document.getElementById（'queueEventButton'）
//创建点击流
可观察。fromEvent（按钮“单击”）
.flatMap（this.doTask）//将每个单击事件传递给异步进程
.scan（（count:number）=>count+1，0）//这只是计算鼠标单击的次数，例如很有用
.subscribe（count=>console.log（`Response received for button click#${count}！`））
}
//模拟两秒钟处理的示例任务
doTask（事件：事件）：可观察{
返回可观察的。fromPromise（新承诺（解析=>{
setTimeout（（）=>解析（事件），2000）
}))
}

昨晚考虑过这个问题，认为您可能希望控制队列的并发性……下面是一个使用rxjs@6如果我没记错的话，你会想用带有MaxConcurrent的FlatMap来制作Rx5，我相信这就是Ionic 3附带的。您必须查找rx版本之间的api更改，但操作员是相同的。