RXJS: подписка на общий оператор вызывает странное поведение - PullRequest
Новая
       18

RXJS: подписка на общий оператор вызывает странное поведение

0 голосов
/ 23 июня 2019

Использование этих инструментов RxJS: BehaviorSubject, Subscribe и Next

Пожалуйста, обратитесь к этой кодовой коробке и посмотрите на консоль, чтобы увидеть визуальное изображение: https://codesandbox.io/s/fancy-bird-0m81p

Вы заметите, что значение объекта "C" в подписке "1 поток позади

Рассмотрим следующий код: 

const initialState = { a: 1, b: 2, c: 3 };

const Store$ = new BehaviorSubject(initialState);

const StoreUpdates$ = Store$.pipe(
  scan((acc, curr) => {
    return Object.assign({}, acc, curr);
  }, initialState),
  share()
);

export const updateStore = update => {
  Store$.next(update);
};

StoreUpdates$.pipe(
  distinctUntilChanged((p, n) => {
    return p.b === n.b;
  })
).subscribe(store => {
  Store$.next({ c: Math.random() });
});

StoreUpdates$.subscribe(store => {
  console.log("Subscription Check:: Notice issue here", store);
});

Когда вы вызываете функцию updateStore, в console.log вы заметите, что значение C, которое обновляется при следующем вызове в подписке, появляется в первой итерации, а старшее значение появляется в последней итерации. Так что как-то это выглядит следующим. Звонок внутри подписки происходит «До»

Полагаю, коды и иллюстрации проиллюстрируют и прояснят ситуацию.

Как сохранить правильный порядок событий, чтобы последнее обновление отображалось в подписке последним?

1 Ответ

0 голосов
/ 25 июня 2019

На данный момент неидеальным способом решения этой проблемы является завершение следующего утверждения в подписке в тайм-аут.Если у кого-то есть лучшее решение, пожалуйста, пишите. 

StoreUpdates$.pipe(
  distinctUntilChanged((p, n) => {
    return p.b === n.b;
  })
).subscribe(store => {
  setTimeout(() => {
    Store$.next({ c: Math.random() });
  },0)
});
...