운동 RXJS에 대한 도움말
2066 단어 react
누군가이 프로그램의 끝에서 나를 도울 수 있습니까?
러너가 도착선을 넘으면 멈춰야 하므로 징글을 울리고 모드 2로 전환합니다.
당신의 도움에 감사드립니다
RX 데모
프리 {
테두리: 1px 솔리드 블랙;
}
스타일>
코드>프리>
<본문>
<버튼>이동
<섹션>
섹션>
<스크립트>
const sorties = [];
const sectionSorties = document.currentScript.previousElementSibling;
for (var i = 0; i &lt; 5; i++) {
const elt = document.createElement("pre");
sorties.push(elt);
sectionSorties.appendChild(elt);
}
var input = rxjs.fromEvent(document.querySelector('input'), 'input');
input.subscribe(evt =&gt; sorties[0].innerHTML += evt.data);
input.pipe(
rxjs.operators.filter(evt =&gt; evt.target.value.length &gt; 4)
, rxjs.operators.map(evt =&gt; evt.target.value)
)
.subscribe(val =&gt; sorties[1].innerHTML = val);
rxjs.operators.delay(10000)
, rxjs.operators.throttleTime(5000)
, rxjs.operators.map(evt =&gt; evt.data.toUpperCase()))
.subscribe(value =&gt; sorties[2].innerHTML += value);
var click = rxjs.fromEvent(document.querySelector('button'), 'click');
click.subscribe(function (evt) { sorties[0].innerHTML = ""; });
input.pipe(
rxjs.operators.takeUntil(click)
, rxjs.operators.map(evt =&gt; evt.target.value)
)
.subscribe(value =&gt; sorties[3].innerHTML = value);
rxjs.merge(
input.pipe(rxjs.operators.map(evt =&gt; evt.target.value.length))
, click.pipe(rxjs.operators.map(evt =&gt; " * "))
)
.subscribe(value =&gt; sorties[4].innerHTML = value);
스크립트>
코드>프리>