javascript RxJS版本

Posted 2021-05-03

const render$ = new Subject()

const nodesEpic = (
  action$,
  state$,
) => (
  action$
  .pipe(
    ofType(START_PROCESSING),
    delay(0),
    switchMap(() => (
      of(state$.value)
      .pipe(
        mergeMap(({
          nodes,
        }) => (
          nodes
        )),
        mergeMap(({
          id,
        }) => (
          render$
          .pipe(
            filter(({
              id: updatedNodeId,
            }) => (
              updatedNodeId === id
            )),
            startWith(0),
            delay(getRandomTimeout()),
          )
          .pipe(
            mapTo(id),
          )
        )),
        bufferTime(40),
        filter((
          ids,
        ) => (
          ids
          .length > 0
        )),
        mergeAll(),
        tap((
          id,
        ) => {
          const node = (
            document
            .getElementById(`node-${id}`)
          )

          node.innerHTML = getRandomValue()
          node.style.color = getRandomColor()

          render$
          .next({ id })
        }),
      )
    )),
    ignoreElements(),
  )
)