React - State

> (World Wide) Web - (W3|WWW) > Javascript (Js|ECMAScript) > React

1 - About

State in React.

State is similar to props, but it is private, fully controlled by the component and triggers a rendering

If the answer to the below question is yes, it probably isn't state.

  • Is it passed in from a parent component?
  • Does it remain unchanged over time?
  • Can you compute it based on any other state or props in your component?

In React apps, whether a component is stateful or stateless is considered an implementation detail of the component that may change over time. You can use stateless components inside stateful components, and vice versa.

Local state is a feature available only to classes.


3 - Management Library

State management library aims to implement logging, hot reloading, time travel, universal apps, record and replay.

A state management library will trace every mutation to the action that caused it. You can record user sessions and reproduce them just by replaying every action.

it is generally recommended to use unidirectional data flow such as:

  • React state,
  • Redux,
  • Flux

3.1 - React State

3.2 - Redux

Redux evolves the ideas of Flux, but avoids its complexity by taking cues from Elm.

  • The whole state of the app is stored in an object tree inside a single store.
  • The only way to change the state tree is to emit an action, an object describing what happened.
  • To specify how the actions transform the state tree, you write pure reducers.

3.3 - Others

  • MobX,
  • Flux

4 - Documentation / Reference