demots:public subject = new Subject() constructor() { } ngOnInit() { ..._rxjs debouncetime">
当前位置:   article > 正文

rxjs中的debounceTime(防抖)运用(angular)_rxjs debouncetime

rxjs debouncetime

用途是 一个按钮,如果在一定时间内连续点击,只会执行最后一次点击的事件。
写一个按钮:

<div>
  <button (click)="demo()">demo</button>
</div>
  • 1
  • 2
  • 3

ts:

public subject = new Subject()

  constructor() {
  }

  ngOnInit() {
    this.subject.pipe(debounceTime(500)).subscribe(() => {
        console.log(11)
      }
    )
  }

  public demo() {
    console.log(22)
    this.subject.next()
  }
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16

控制台:
单次点击:
在这里插入图片描述
多次点击:
在这里插入图片描述
点了8次按钮,console出8个22,但只有一个11。

.pipe()的写法好像是angular6(记不清了)以后的写法,之前的版本不用加pipe。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/小丑西瓜9/article/detail/222964
推荐阅读
相关标签
  

闽ICP备14008679号