Javascript RxJS限制几个输入范围

Javascript RxJS限制几个输入范围,javascript,rxjs,Javascript,Rxjs,我有几个范围,我想把它们的总和限制在100。有了这段代码,我就可以完成它了,但很明显,可观察的对象被困在那里,不再返回任何值。我如何才能实现相同的效果,但允许滑块向右移动,当然不能使用此限制状态 let limit = 0; function setStream(parent) { const mousemove = Rx.Observable.fromEvent(document, 'mousemove'); const parentBound = parent.getB

我有几个范围,我想把它们的总和限制在100。有了这段代码,我就可以完成它了,但很明显,可观察的对象被困在那里,不再返回任何值。我如何才能实现相同的效果,但允许滑块向右移动,当然不能使用此限制状态

 let limit = 0;

 function setStream(parent) {
    const mousemove = Rx.Observable.fromEvent(document, 'mousemove');
    const parentBound = parent.getBoundingClientRect();
    const parentLeft = parentBound.left;
    const parentWidth = parentBound.width;
    const percentage = toPercentage(parentWidth);

    return (target) => {
        const mousedown = Rx.Observable.fromEvent(target, 'mousedown');
        const mouseup = Rx.Observable.fromEvent(document, 'mouseup');

        return mousedown
            .flatMap(() => {
                return mousemove
                    .map((e) => {
                        const perct = R.compose(Math.round, percentage)(e.clientX - parentLeft);

                        return {
                            target: target,
                            position: perct
                        };
                    })
                    //block range at 100
                    .filter(state => state.position >= 0 && state.position <= 100 && limit !== 100)
                    .map((state) => {
                        const nState = state;
                        nState.target.style.left = `${nState.position}%`;
                        return nState;
                    })
                    .takeUntil(mouseup);
            });
    };
}


return Rx.Observable.combineLatest(...sliders$)
        .map((state) => {
            limit = state.reduce((prev, curr) => curr.position + prev, 0);
            return state;
        });
let limit=0;
函数setStream(父函数){
const mousemove=Rx.Observable.fromEvent(文档“mousemove”);
const parentBound=parent.getBoundingClientRect();
const parentLeft=parentBound.left;
const parentWidth=parentBound.width;
const percentage=toPercentage(parentWidth);
返回(目标)=>{
const mousedown=Rx.Observable.fromEvent(目标“mousedown”);
const mouseup=Rx.Observable.fromEvent(文档“mouseup”);
返回鼠标向下
.flatMap(()=>{
返回鼠标移动
.map((e)=>{
const perct=R.compose(数学四舍五入,百分比)(e.clientX-parentLeft);
返回{
目标:目标,,
职位:perct
};
})
//挡块范围为100
.filter(state=>state.position>=0&&state.position{
const nState=状态;
nState.target.style.left=`${nState.position}%`;
返回nState;
})
.takeUntil(mouseup);
});
};
}
返回Rx.Observable.CombineTest(…滑块$)
.map((状态)=>{
限制=状态减少((上一个,当前)=>当前位置+上一个,0);
返回状态;
});
谢谢