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