有没有更简洁的方式在合并中组织多个 RXJS 可观察对象？

Question

下面的史诗按预期工作。它在进行 api 调用之前调用合并运算符内的多个操作。但是，我只是想知道是否有一种调用重置操作的方法比我列出单独的可观察对象更简洁。是否可以将它们列在一个数组中？或者其他方式？

const imageUploadEpic = (action$, state$) =>
  action$.pipe(
    ofType('UPLOAD_IMAGE'),
    mergeMap(action =>
      concat(
        merge(
          of({ type: 'RESET_IMAGE' }),
          of({ type: 'RESET_COLOURS' }),
          of({ type: 'RESET_LOCALISER' })
        ),
        from(
          axios.post(`/uploads/url`, {
            url: action.src
          })
        ).pipe(
          map(response => ({
            type: 'UPLOAD_IMAGE_SUCCESS',
            data: response.data,
          })),
          catchError(error =>
            of({
              type: 'UPLOAD_IMAGE_ERROR',
              error
            })
          )
        )
      )
    )
  );

Answer 1

您可以利用 concat 接受 ObservableInput 参数并且数组是 ObservableInput:

const imageUploadEpic = (action$, state$) =>
  action$.pipe(
    ofType('UPLOAD_IMAGE'),
    mergeMap(action =>
      concat(
        [
          { type: 'RESET_IMAGE' },
          { type: 'RESET_COLOURS' },
          { type: 'RESET_LOCALISER' }
        ],
        from(axios.post(`/uploads/url`, { url: action.src })).pipe(
          map(response => ({
            type: 'UPLOAD_IMAGE_SUCCESS',
            data: response.data,
          })),
          catchError(error =>
            of({
              type: 'UPLOAD_IMAGE_ERROR',
              error
            })
          )
        )
      )
    )
  );

有没有更简洁的方式在合并中组织多个 RXJS 可观察对象？

Is there a cleaner way of organising multiple RXJS observables inside a merge?

rxjs

redux-observable