DEV Community

Discussion on: Is React SOLID?

Collapse
 
alainvanhout profile image
Alain Van Hout

With regard to Liskov: on the one hand, you could see your component as accepting props that require certain fields, but entirely allow that the input has more fields than those. On the other hand, if we take the functional html as the output of your component, then your 'red button' will function just as well anywhere that a regular button would have worked.

So in relation to constraints of the information that is passed around, React does seem to inherently follow the L in SOLID.

Collapse
 
kayis profile image
K

I think the problem is, that you have to do this actively.

if you just do

const RedButton = props => <Button onPress={props.onPress} style=/>

The RedButton only behaves as a Button in respect to the onPress handler.

You would have to do

const RedButton = props => <Button {...props, style: {...props.style, color: "red"}}/>

to get all the props.

Collapse
 
alainvanhout profile image
Alain Van Hout

In the second case the location/context where you use RedButton would not need to be aware of the difference between a Button and a RedButton, so you'd be able to use a RedButton anywhere where you'd otherwise be able to use a Button (-> conforms to LSP there, I would think).