RXJS在管道中组合多个可观察对象

import { of, fromEvent } from 'rxjs';
import { mergeMap, map, filter } from 'rxjs/operators';

// 创建一个简单的可观察对象
const source1$ = of(1, 2, 3);

// 从事件源创建一个可观察对象
const button = document.querySelector('button');
const source2$ = fromEvent(button, 'click');

// 组合两个可观察对象
const combined$ = source1$.pipe(
  mergeMap(value => {
    console.log(`Source1 value: ${value}`);
    return source2$.pipe(
      map(event => `Button clicked: ${event.type}`),
      filter(() => value % 2 === 0) // 只处理偶数值
    );
  })
);

// 订阅组合后的可观察对象
combined$.subscribe({
  next: value => console.log(value),
  error: err => console.error(err),
  complete: () => console.log('Complete')
});

import { of } from 'rxjs';
import { catchError } from 'rxjs/operators';

const source$ = of('Hello', 'World').pipe(
  map(value => {
    if (value === 'World') {
      throw new Error('Value cannot be World');
    }
    return value;
  }),
  catchError(err => {
    console.error(err);
    return of('Default Value');
  })
);

source$.subscribe({
  next: value => console.log(value),
  error: err => console.error(err),
  complete: () => console.log('Complete')
});