Material UI 图标的类型

16 javascript typescript reactjs react-native material-ui

我有一个如下所示的组件:

type IconButtonProps = { text: string ; onClick: () => void, icon: any};

export const IconButton: FunctionComponent<IconButtonProps> = ({
  text,
  onClick,
  icon,
}) => {
  const classes = useStyles();
  return (
    <Button className={classes.button} 
    onClick={onClick}
   >
     {' '}
    {icon}
     {text}
   </Button>
  );
};
Run Code Online (Sandbox Code Playgroud)

并被这样称呼:


import SearchIcon from '@material-ui/icons/Search';

<IconButton text={'Search'} icon={<SearchIcon />} onClick={()=>SearchUsers()}></IconButton>
Run Code Online (Sandbox Code Playgroud)

在道具中,我使用any图标的类型。正确的使用类型是什么?我想避免使用任何类型。

ale*_*ero 25

或许import { SvgIconComponent } from "@material-ui/icons";

  • 谢谢!这对我有用。对于 MUI V5,它是 `import { SvgIconComponent } from "@mui/icons-material";` (10认同)
  • 它是一种类型https://github.com/mui-org/material-ui/blob/9bd4277ecd660ebe2fd4cb08960f58e98ddb6d43/packages/material-ui-icons/scripts/create-typings.js#L24 (3认同)
  • 这是一个组件,而不是一个类型? (2认同)