What will be Scroll Event Type in TypeScript and Reactjs

user_14099776 0
Viewed 3783

I know we can use event listener and work with ScrollEvent.

But suppose following method:

handleScroll =(event:any):void=>{
const target = event.target;
// further code goes her
}

I want to use event type instead of any so what should be its type?

typescript reactjs javascript
2 Answers

if you aim to catch the mouse-wheel scroll event then you can use this type.

handleScroll = (event: WheelEvent): void =>
user_85525500

If you are not doing this in React then you would use

handleScroll = (event: Event):void => {
  const target = event.target;
  // further code goes here
}

If you using React and the scrolling is being done in a <div> then you would use

handleScroll = (event: React.UIEvent<HTMLDivElement>):void => {
  const target = event.target;
  // further code goes here
}

If the event is occuring on another type of element (and using React) then you should substitute that for <HTMLDivElement>.

As per a comment I wrote below another post here, you should not confuse wheel and scroll events.

user_12187460
Related