Как исправить 'элемент неявно имеет тип' любой '. TS7031 'для функции?

Question

Я новичок в реакции, получаю сообщение об ошибке

Элемент привязки onClick неявно имеет тип «любой». TS7031

В следующем коде

const CloseButton = ({ onClick }) => {
  const classes = useStyles();
  return <CloseIcon className={classes.closeButtonStyles} onClick={onClick} />;
};

Я знаю, что мне нужно определить тип, но я не знаю, какой из них для функции onClick. Google мне не помогает.

Кто-нибудь знает, какой тип я должен использовать?

Answer 1

Это зависит от того, что ожидает CloseIcon prop. Многие нативные элементы HTML принимают React MouseEventHandler вместо onClick.

Например:

import React, { MouseEventHandler } from 'react';

function MyComponent({ onClick }: { onClick: MouseEventHandler }) {
  return (
    <button onClick={onClick}>Button</button>
  );
}

Так что вы можете попробовать:

import { MouseEventHandler } from 'react';


const CloseButton = ({ onClick }: { onClick: MouseEventHandler }) => {
  const classes = useStyles();
  return <CloseIcon className={classes.closeButtonStyles} onClick={onClick} />;
};