I'm facing a problem using default parameters in a functional component (React.js v17.0.2). I have the component above, which receives specific parameters with a default value. How can I make this component able to still receiving props like when using MyComponent(props){...} ? More specific, how can I make this component able to receive props.children?
export default function Box({style = "red-box"}, {size="xl"} ) {
console.log(props)
return (
<div className={`${style} ${size}`}>
{props.children} <----
</div>
)}
Hope the idea is clear. Thanks in advance!
Does this suffice?
export default function Box({children, size="xl", style="red-box"}) {
return (
<div className={`${style} ${size}`}>
{children}
</div>
)}