Print the sum of x coordinates of mouse click events using Angular RXJS

The source code:

ngOnInit(): void {
    const button = document.querySelector('button');
    fromEvent(button, 'click').pipe(map(event= > (event as MouseEvent).x ), scan((count, clientX) = > count + clientX, 0))
    .subscribe(count= > console.log(`total sum of mouse event.x: ${count} `));
  }
Copy the code

Operation effect:

The MouseEvent definition used in the code is interesting, as shown here:

For more of Jerry’s original articles, please follow the public account “Wang Zixi “: