Search code examples
reactjscomponentsstatelessconceptualstateful

Is there any difference between controlled vs uncontrolled and statefull vs stateless components?


I am curious whether there is any difference when we try to differentiate react components as controlled vs uncontrolled and stateful vs stateless. Are we differentiating the same thing here with different terminologies or is there an actual difference when we distinguish in such a way? I am beginning to suspect there are subtle changes but cannot wrap my head around them. If there are no differences please provide a brief explanation as to why such a reasoning is invalid. If there are please explain the differences no matter how minute they may be.


Solution

  • While in a few cases, these terminologies might mean the same, there is actually a difference between them

    controlled vs uncontrolled is basically used to specify whether the view or the state of the component can be controlled from within itself or from outside.

    stateless vs statefull is used to describe whether the component contains state or not. A controlled component can also contain a state. In React generally a stateless component is written as a Functional component which is View only component but can also be written as a Class component making use of lifecycle method/or not