“React odrzut” Kod odpowiedzi

React odrzut

import { atom, useRecoilValue, selector } from "recoil";

// create an atom
const numberState = atom({
  key: "numberState",
  default: 0,
});

// then use it
function Component() {
  const [number, setNumber] = useRecoilState(numberState);

  return <button onClick={() => setNumber((num) => num + 1)}>{number}</button>;
}

// to derive an atom
const aboveFiveState = selector({
  key: "aboveFiveState",
  get: ({ get }) => {
    const number = get(numberState);

    return number > 5;
  },
});

// async atom
const userState = atom({
  key: "userState",
  get: async ({ get }) => getUser(),
});

// if you only want to read an atom
const number = useRecoilValue(numberState);

// if you only want to write to an atom
const setNumber = useSetRecoilState(numberState);