0
135
ViewsReact - what should be the propType of Material UI icon
I am going to pass MUI icon to component Test and I want to create Protype for the icon, but I am not sure what should be the correct proptype of the icon
App.js
import "./styles.css";
import VisibilityIcon from "@material-ui/icons/Visibility";
import Test from "./Test";
export default function App() {
return (
<div className="App">
<Test icon={<VisibilityIcon />} />
</div>
);
}
Test.jsx
import PropTypes from "prop-types";
function Test(props) {
const { icon } = props;
return (
<div>
Icon:
{icon}
</div>
);
}
Test.propTypes = {
// icon: ??????
};
export default Test;
https://codesandbox.io/s/intelligent-curie-8mtbw?file=/src/Test.jsx:0-213
·
Juan Pablo Isaza
2 answers
Answer question0
It should be a PropTypes.element
Test.propTypes = {
icon: PropTypes.element
};
Working Example:
·
Juan Pablo Isaza
Report
0
I'd go with PropTypes.element here if you want to be specific.
Test.propTypes = {
icon: PropTypes.element,
};
// A React element. optionalElement: PropTypes.element,
If you want to be a little more loose/general, then use PropTypes.node for anything that is renderable.
// Anything that can be rendered: numbers, strings, elements or an array // (or fragment) containing these types. optionalNode: PropTypes.node,
·
Juan Pablo Isaza
Report
Answer question