rxjs封装click,mousedown,mouseup事件

发布于 2022-09-11 19:49:17 字数 639 浏览 21 评论 0

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却在变###
想不明白,求帮助

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

梦太阳 2022-09-18 19:49:17

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

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

let source2 = zip(mouseDown, mouseUp)
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文