Question

我观看了一个关于如何在2个可观察对象上使用mergeMap（）的教程，但我仍然非常不清楚如何将其用于2个以上的可观察对象。

以下是教程的链接： https://www.youtube.com/watch?v=b59tcUwfpWU&t=1s

这是3个observables的代码，用于连接三个输入并在html上动态显示。

＆＃13;

var input1 = document.querySelector('#input1');
var input2 = document.querySelector('#input2');
var input3 = document.querySelector('#input3');

var span = document.querySelector('span');

var obs1 = Rx.Observable.fromEvent(input1, 'input');
var obs2 = Rx.Observable.fromEvent(input2, 'input');
var obs3 = Rx.Observable.fromEvent(input3, 'input');


obs1.mergeMap((event1) => {
	return obs2.map((event2) => {
  	return event1.target.value + ' ' + event2.target.value;
  });
}).mergeMap((result) => {
	return obs3.map((event3) => {
  	return result + ' ' + event3.target.value;
  });
}).subscribe((combinedValue) => {
	console.log(combinedValue);
	return span.textContent = combinedValue;
})

＆＃13;

<script src="https://unpkg.com/@reactivex/rxjs@5.3.0/dist/global/Rx.js"></script>

<input type="text" id="input1">
<input type="text" id="input2">
<input type="text" id="input3">

<p>Combined value: <span></span></p>

＆＃13;

我的问题是，当我输入第一个和第二个输入时，显示器不会动态显示更改，直到我在第三个输入中输入内容。

我目前对mergeMap（）的理解是它将一系列可观察量序列展平为一系列可观察量。

Answer 1

我想你想要运营商import QtQuick 2.7 import QtQuick.Controls 2.0 import QtQuick.Layouts 1.3 SwipeView { id: swipeView anchors.fill: parent currentIndex: tabBar.currentIndex Page1 { } Page { Label { text: qsTr("Second page") anchors.centerIn: parent } } onIndexChanged: { //error is in this line console.log(index) } } 为了简化操作，我会在每个combineLatest()之后映射event.target.value，并且可能会抛出fromEvent，因为在用户输入之前不会发生任何事情。

＆＃13;

startWith('')

＆＃13;

console.clear()
var input1 = document.querySelector('#input1')
var input2 = document.querySelector('#input2');
var input3 = document.querySelector('#input3');

var span = document.querySelector('span');

var obs1 = Rx.Observable.fromEvent(input1, 'input')
  .map(e=>e.target.value)
  .startWith('')

var obs2 = Rx.Observable.fromEvent(input2, 'input')
  .map(e=>e.target.value)
  .startWith('')

var obs3 = Rx.Observable.fromEvent(input3, 'input')
  .map(e=>e.target.value)
  .startWith('')

Rx.Observable.combineLatest(obs1,obs2,obs3)
.map(([val1,val2,val3]) => val1 + ' ' + val2 + ' ' + val3) 
.subscribe((combinedValue) => {
	console.log(combinedValue);
	return span.textContent = combinedValue;
})

＆＃13;

mergeMap（）RXJS 3可观察量

1 个答案: