使用RXJs流切換和隱藏

Question

我想創建一個使用RX Js作爲練習的邊欄菜單。這是我走到這一步：

var hideStream = Rx.Observable 
.fromEvent(hideButton, 'click') 
.map(() => false); 

var toggleStream = Rx.Observable 
.fromEvent(toggleButton, 'click') 
.map(() => true); 

var resultStream = Rx.Observable.merge(
toggleStream, hideStream) 
.startWith(false) 
.scan(function(value, newValue) { 
    if (newValue) { 
    return !value; 
    } else { 
    return false; 
    } 
}); 

的toggleStream觀察到的監聽漢堡包，並允許用戶切換菜單的可見性。第二個可觀察的hideStream必須能夠隱藏菜單，而不管當前狀態如何。

這是按預期工作，但我想知道是否有更好的方法。我在scan運營商確實感覺有點怪，我...

工作示例這裏：https://jsbin.com/hozozolune

Answer 1

這看起來相當好了給我，我們可以合併hideStream時進一步簡化和之後的toggleStream我們的toggleStream設置正確：

var hideStream = Rx.Observable 
.fromEvent(hide, 'click') 
.mapTo(false); 

var toggleStream = Rx.Observable 
.fromEvent(toggle, 'click') 
.mapTo(true) 
.startWith(false) 
.scan(value => !value); 

var resultStream = Rx.Observable.merge(toggleStream, hideStream);