Question

我有一个按钮 - <button></button>。

此按钮应在每次按下时增加输入字段的值。这很容易。我不知道的是如何在按下按钮时定期增加值，并在用户离开按钮或按下按钮时停止。以下是所有涉及事件的可观察性。我需要以某种方式将它们组合以实现期望的结果。有什么帮助吗？

const click = Observable.fromEvent(button, 'click');
const mousedown = Observable.fromEvent(button, 'mousedown');
const mouseup = Observable.fromEvent(button, 'mouseup');
const mouseleave = Observable.fromEvent(button, 'mouseleave');

以下是观察员：

const observer = () => {
    console.log('click');
};

换句话说，我试图让我的按钮与类型编号的输入元素上的原生箭头按钮类似。

Answer 1

我想我明白了：

  const button = document.getElementById('button');

  const click = Rx.Observable.fromEvent(button, 'click');
  const mousedown = Rx.Observable.fromEvent(button, 'mousedown');
  const mouseup = Rx.Observable.fromEvent(button, 'mouseup');
  const mouseleave = Rx.Observable.fromEvent(button, 'mouseleave');

  const observer = () => {
    console.log('click');
  }

  click.subscribe(observer);
  const notifier = mouseup.merge(mouseleave);
  const final = mousedown
    .switchMap(e => {
      return Rx.Observable.interval(200).takeUntil(notifier);
    })
    .subscribe(observer);

如何在按下按钮时发出值？

1 个答案: