Recoil State Management for React

programming web dev
1

Recoil is the hot, new (experimental) state management library coming out of Facebook for React.

Makes it easy to efficiently share state update across components using a useState-like Recoil hook. Example (partial) from Getting Started:

const textState = atom({ // <- Recoil state atom (unit of state data)
  key: 'textState', // unique ID (with respect to other atoms/selectors)
  default: '', // default value (aka initial value)
});

function TextInput() {
  const [text, setText] = useRecoilState(textState); // <- Recoil state hook

  const onChange = (event) => {
    setText(event.target.value);
  };

  return (
    <div>
      <input type="text" value={text} onChange={onChange} />
      <br />
      Echo: {text}
    </div>
  );
}