Combining input streams then using scan
to track the results is a common scenario when coding with streams. This lesson walks you through setting up two buttons and merging their input events together to build a streaming Counter component.
const CounterStream = componentFromStream(
props$ => { const { stream: onInc$, handler: onInc } = createEventHandler();
const { stream: onDec$, handler: onDec } = createEventHandler(); return props$
.switchMap(
propos => Observable.merge(
onInc$.mapTo(1),
onDec$.mapTo(-1)
)
.startWith(propos.value)
.scan((acc, curr) => acc + curr)
.map((value) => ({ value, onInc, onDec })))
.map(
Counter
)
}
);