我不明白 rxjs 中的某些内容。当有人:
- 有时点击墨水按钮
- 然后点击第二个订阅按钮
- 然后在 inc 按钮上重新单击几次
为什么看起来 accumulator observable 在第二次订阅期间被克隆了?谢谢。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Reprex rxjs</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.5.5/rxjs.umd.js">
</script>
</head>
<body>
<button id="inc_button">Click me to increase</button>
<button id="go_button">Start second counter</button>
</div>
<script>
let score_calc = rxjs
.fromEvent(document.getElementById('inc_button'), 'click')
.pipe(rxjs.operators.scan(acc => acc+1, 0));
score_calc.subscribe(x => console.log('score1',x));
rxjs
.fromEvent(document.getElementById('go_button'), 'click')
.pipe(rxjs.operators.first())
.subscribe(()=> score_calc.subscribe(x => console.log('score2',x)));
</script>
</body>
</html>
注意:我是 JavaScript 新手。
回答1
这与 rx 的关系比与 javascript 的关系更大。查看冷热可观察对象之间的区别,您会发现可以让您在多个订阅者之间共享流的运算符。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Reprex rxjs</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.5.5/rxjs.umd.js">
</script>
</head>
<body>
<button id="inc_button">Click me to increase</button>
<button id="go_button">Start second counter</button>
</div>
<script>
let score_calc = rxjs
.fromEvent(document.getElementById('inc_button'), 'click')
.pipe(
rxjs.operators.scan(acc => acc+1, 0),
rxjs.operators.shareReplay(1)
);
score_calc.subscribe(x => console.log('score1',x));
rxjs
.fromEvent(document.getElementById('go_button'), 'click')
.pipe(rxjs.operators.first())
.subscribe(()=> score_calc.subscribe(x => console.log('score2',x)));
</script>
</body>
</html>