Yes, you can use that in some cases.
But some times, it doesn't necessary to create another component extended from another component.
I'm not even sure, but I think it does affect your components tree and run-time too.
But if you send your customized styles as a prop, you just affected your build-time, not adding another component.
That's another point (:
It will increase the React's run-time.
Because it will be added as inline-styles in HTML tag.
But if you pass this style props into the body of styled-component, it will be used in build-time.
Run-time speed is completely negligible and isn't something which should be considered when working with Styled-components, although the output should be considered.
Both "regular" extending and your "styles" method will create 2 seperate CSS selectors.
everytime you're writing ${props... a new selector is created for each of the props scenarios. just like each choice you make creates a parallel universe :)
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Why not to use default components' extending mechanism provided by styled-components?
Yes, you can use that in some cases.
But some times, it doesn't necessary to create another component extended from another component.
I'm not even sure, but I think it does affect your components tree and run-time too.
But if you send your customized styles as a prop, you just affected your build-time, not adding another component.
Well, if you don't want to add another SC component, you can just inline styles like in regular react component without introducing extra
styles
prop:That's another point (:
It will increase the React's run-time.
Because it will be added as inline-styles in HTML tag.
But if you pass this style props into the body of styled-component, it will be used in build-time.
Run-time speed is completely negligible and isn't something which should be considered when working with Styled-components, although the output should be considered.
Both "regular" extending and your "styles" method will create 2 seperate CSS selectors.
everytime you're writing
${props...
a new selector is created for each of the props scenarios. just like each choice you make creates a parallel universe :)