Let's say I have a simple component like this one (assume everything is imported properly):
const SpecialButton = (props) => {
const { css, ...rest }
return (
<Button
className={`special-btn ${css}`}
{...rest}
>
Click here
</Button>
);
};
SpecialButton.defaultProps = {
css: '',
rest: {}
};
SpecialButton.propTypes = {
css: PropTypes.string,
rest: PropTypes.object
}
I'm setting a default value of {} for the rest props and I'm also using object destructuring to pass it to the Button component.
So, assuming that who uses the SpecialButton is not passing anything else besides the css props, my questions are:
- Since {} is an instance of the Object class, when I use the
...does it dump all the properties of the Object into the Button component? - Is there any problem in not specifying a default value for the rest props?
- Do you guys have a better suggestion about how to handle this case?
I'm adding the prop type and default prop for completeness, but I'm not 100% sure if I need to.
Thank you.
Aucun commentaire:
Enregistrer un commentaire