rxjs封装click,mousedown,mouseup事件

let mouseDown = fromEvent(ele, 'mousedown');
let mouseUp = fromEvent(ele, 'mouseup');
let mouseMove = fromEvent(ele, 'mousemove');
let source2 = mouseDown
.pipe(
    map(ev => { 
        console.log('map1',ev.timeStamp)
        return mouseUp.pipe(map(ev2 => {
            console.log('map2',ev.timeStamp)
            return [ev, ev2]
        }))
    }),
    concatAll()
)
.pipe(
    debounceTime(250)
)
source2.subscribe(res => {
    console.log('res',res[1].timeStamp, res[0].timeStamp)
    // if(res[1].timeStamp - res[0].timeStamp > 500) {

    // }
})

为什么map2的值恒定不变,map1却在变###
想不明白,求帮助

阅读 2.2k
1 个回答

concatAll的机制是订阅从上游传下来的第一个流,当第一个流完结时,在订阅第二个流,而你这个上游map中产生的流来自于mouseUp,是一个无限流永远不会完结,导致concatAll永远也没有机会订阅第二个流,而这个流中的ev就是来自mouseDown的第一次点击,所以值一直是固定的.

如果要想要获取成对的mouseDownmouseUp的值的话,用zip

let source2 = zip(mouseDown, mouseUp)