如何修复“元素隐式具有“任何”类型。TS7031' 的功能？

Question

我是新来反应的，但收到错误

绑定元素“onClick”隐式具有“any”类型。TS7031

关于下面的代码

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

我知道我需要定义一个类型，但我不知道 onClick 函数的类型。谷歌没有给我任何帮助。

有人知道我要使用什么类型吗？

Answer 1

这取决于propCloseIcon的onClick期望。许多原生 HTML 元素将接受 React MouseEventHandlerfor 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} />;
};