什么打字稿类型用于函数参数？

Question

When onClick is triggered, the pressed HTML element (which is an <svg> element) is passed to handleClick as an argument (the argument is called "pressedElement"). Since I've assigned to it any type and using any is considered a bad practice, I'd like to replace any by another Typescript type. What type should I use instead of using any ?

This is the code of component:

import useScrollTrigger from '@material-ui/core/useScrollTrigger';
import Zoom from '@material-ui/core/Zoom';
import './Catalog.scss';
  
  const ScrollTop = (props: any) => {
    const { children, window } = props;
    const trigger = useScrollTrigger({
      target: window ? window() : undefined,
      disableHysteresis: true,
      threshold: 100,
    });
  
    const handleClick = (pressedElement: any) => {
      
      const anchor = (pressedElement.ownerDocument || document).querySelector('#back-to-top-anchor');
  
      if (anchor) {
        anchor.scrollIntoView({ behavior: 'smooth', block: 'center' });
      }
    };
  
    return (
      <Zoom in={trigger}>
        <div 
          onClick={({ target }) => handleClick(target)} 
          role="presentation" 
          className="scrollTop"
        >
          {children}
        </div>
      </Zoom>
    );
  }

  export default ScrollTop;

Answer 1

The first parameter of the onClick event is React.FocusEvent and your destructuring target whos type is EventTarget & HTMLInputElement.

I have replicated your code on this codesandbox you can see that the types work and hovering on them shows you the type https://codesandbox.io/s/snowy-cloud-jlqwx?file=/src/Component.tsx