8. Accepting properties into your custom component - florypaul/ReactJS GitHub Wiki

When using component as a wrapper for other components (Composition example). I should be able to give a dynamic className

How can I achieve this? In the component where you are using this there give the className <Card className={classes.input}> some html/jsx code </Card>

In the Card component we need to make sure that card accepts this new className property, so how do define it

In Card.js - use template literal/backtick(``) key and enter the properties using a $ symbol ${props.classname}

function Card(){ return( <div className={${classes.card} ${props.classname}}> {props.children} </div> ) }