how to specify other props in typescript react code example
Example 1: react typescript props
type CarProps = {
name: string;
brand: string;
price;
}
const Car: React.FC<CarProps> = (props) => {
const { name, brand, price } = props;
}
const Car: React.FC<CarProps> = ({ name, brand, price }) => {
}
Example 2: react typescript pass component as prop
interface ParentCompProps {
childComp?: React.ReactNode;
}
const ChildComp: React.FC = () => <h2>This is a child component</h2>
const ParentComp: React.FC<ParentCompProps> = (props) => {
const { childComp } = props;
return <div>{childComp}</div>;
};
function App() {
return (
<>
<ParentComp childComp={<ChildComp />} />
<ParentComp childComp={<h3>Child component 2</h3>} />
<ParentComp childComp={(
<div style={{border: '2px solid red'}}>
<h4>Child component</h4>
<p>With multiple children</p>
</div>
)} />
</>
);
}