Let's explore 3 basic criteria to define what is and isn't part of the state. These criteria allow me to confidently decide on the "minimal but complete representation of the state" in my day-to-day as a React Lover.
Criterion 1: Expected to change.
Even though we know that state is immutable, it's usually tied to a part of the interface that is mutable. So, as a first criterion, we should evaluate if there's a part of the UI that's expected to change based on that value. If so, it's very likely that we're dealing with a candidate to be state, but before that, evaluate the following two criteria.
Criterion 2: Should not be inherited from any component.
If the value that defines the candidate to become state is received from another component, then it shouldn't be a state. It's possible that it's a state in the component that originally inherits it, but not the component that receives it.
Criterion 3: Should not be calculated from another state.
If the value must be calculated using another state as a base, then it's not a state, and its interaction in the interface should be shown based on the calculation of the original state.
Top comments (0)