首页 > 解决方案 > 避免嵌套 Observables(完成时的 mergeMap)

问题描述

得到了一个抓取服务的伪代码,它首先探索分页 url,然后是抓取的“父”网站上的子页面 url

const pagination = [["url-1", "url-2", "url-3", "url-4"], ["url-5"]];
const timeInterval = 2;

sendRequestsInIntervals(pagination, timeInterval )
  .pipe()
  .subscribe({
    next(x) {
      console.log(x);
    },
    error(err) {
      console.error(err);
    },
    complete() {
      console.log("done");
      sendRequestsInIntervals(resDataArray, timeInterval ).subscribe({
        next(x) {
          console.log(x);
        },
      });
    },
  });

我想避免嵌套,因为它是使用 observables 的不正确方式

有没有办法把它转换成这样的东西:

sendRequestsInIntervals(pagination, timeInterval )
  .pipe(
    waitUntilCompletes()
    mergeMap((resDataArray) => {
      return sendRequestsInIntervals(resDataArray, timeInterval );
    })
  )
  .subscribe({
    next(x) {
      console.log(x);
    },
    error(err) {
      console.error(err);
    },
    complete() {
      console.log("done");
    },
  });

添加了一个名为waitUntilCompletes()的伪函数

rxJS 中是否有这样的事情,它使 mergeMap 中的 observable 在运行之前等待,直到前一个 observable 完成?

标签: javascriptrxjsobservablemergemap

解决方案


操作员last将忽略所有排放,直到完成后的最后一个排放:

sendRequestsInIntervals(pagination, timeInterval )
  .pipe(
    last(),
    mergeMap((resDataArray) => { // resDataArray is only the final emitted value from sendRequestsInIntervals() 
      return sendRequestsInIntervals(resDataArray, timeInterval );
    })
  )
  .subscribe({
    next(x) {
      console.log(x);
    },
    error(err) {
      console.error(err);
    },
    complete() {
      console.log("done");
    },
  });

或者您可以使用reduce收集排放物并在完成后排放:

sendRequestsInIntervals(pagination, timeInterval )
  .pipe(
    // this will gather all outter emissions into an array and emit once outter completes
    reduce((acc, val) => acc.concat(val), []),
    mergeMap((resDataArray) => { // resDataArray is all values emitted from sendRequestsInIntervals() in an array
      return sendRequestsInIntervals(resDataArray, timeInterval );
    })
  )
  .subscribe({
    next(x) {
      console.log(x);
    },
    error(err) {
      console.error(err);
    },
    complete() {
      console.log("done");
    },
  });

推荐阅读