Předání dat z vnouče, aby rodič Reagovat

Pokud chcete sdílet státu mezi různými komponenty v aplikaci, a jste přesvědčeni, že absolvování Státu jako rekvizita je "velmi dlouhá cesta" se pohybovat jsem asi byste měli zvážit něco jako použití souvislosti háček.

Buď jak buď, jaký jsi právě popsal, vypadá jako jednoduchý případ užití čarodějnice nebude potřebovat kontextu.

Co byste měli udělat, je: Na mateřskou máte [státní, setState] Na aktuální komponentu projít setStat jako rekvizita k dětské složky a pak se z dítěte součásti projít setState jako rekvizita na vnouče součásti.

Pak se na vnouče složky, můžete udělat něco jako: rekvizity.setState(pole). Takže teď na rodičovské komponenty proměnné státu bude muset být aktualizován s hodnotou pole z vnoučete součásti.

Pokud chcete předat státu, aby sourozenci součásti, a tím, sourozenec, předpokládám, že myslíte sourozence, rodiče, Pak byste se měli přesunout stát z rodičů jednu úroveň nahoru řekněme, že rodič rodič.. a dělat to, co jsem popsal výše.

Takže vytvořit useState vysoko ve vašem stromu komponent, A složit Státní a setState stejně na děti jako rekvizity, setState bude předán jako funkce, takže můžete volat na vnouče složky nebo jiné složky

Pokud jsem pochopit, co se ptáte, by to mohlo být něco jako tohle.

const GrandChild = ({ setParentInfo }) => {
  const info = [1, 2, 3];

  const handleClick = () => {
    setParentInfo(info);
  };

  return <button onClick={handleClick}>Set parent info</button>;
};

const Sibling = ({ parentInfo }) => {
  return <div>{parentInfo.length}</div>; // Do whatever you need with parentInfo
};

const Parent = () => {
  const [parentInfo, setParentInfo] = useState([]);

  return (
    <div>
      <GrandChild setParentInfo={setParentInfo} />
      <Sibling parentInfo={parentInfo} />
    </div>
  );
};

Tady nemusíte kontextu, protože nemáte tolik vrstev, ale pokud potřebujete vrtat dolů rekvizity než pomocí kontextu.