Kaj pomeni dviganje stanja navzgor?

Question

Accepted Answer

**Dviganje stanja navzgor** pomeni premikanje stanja iz otroške komponente v **skupnega starša**, tako da lahko več otrok deli in ostane usklajeno z istimi podatki. To je standardna rešitev, ko se bratske komponente morajo usklajiti. ## Težava: bratske komponente potrebujejo skupne podatke ```jsx // ❌ each child has its OWN state — they can't sync function TempInput() { const [temp, setTemp] = useState(0); ... } // Two sibling TempInputs (Celsius & Fahrenheit) can't see each other's value ``` Če ima vsaka od dveh bratskih komponent lastno kopijo povezanega stanja, ni načina, da bi ostali dosledno — sprememba ene ne vpliva na drugo. ## Rešitev: dvigni stanje na starša ```jsx function Calculator() { const [temperature, setTemperature] = useState(0); // state LIFTED to the parent return ( <> {/* pass state DOWN as a prop, and a setter to update it */}

Both inputs share one value: {temperature}

); } function TempInput({ value, onChange }) { return onChange(e.target.value)} />; } ``` Sodeljavano stanje zdaj živi v staršu (`Calculator`). Prosledi vrednost *navzdol* kot prop in setter, tako da otroci lahko zahtevajo spremembe (*navzgor*). Zdaj oba vhodna polja odražata isto vsoto — urejanje enega posodobi obe. ## Vzorec ```text 1. Find the closest COMMON ancestor of the components that need to share 2. Move the state UP into that ancestor 3. Pass the value DOWN as props 4. Pass a callback DOWN so children can request updates (data up via events) ``` To je isti tok "podatki navzdol, dogodki navzgor", uporabljen za deljenje stanja. ## Ko postane dviganje preveliko ```text Lifting too high (state ends up far from where it's used) → prop drilling. At that point, prefer Context or a state library instead of lifting further. ``` ## Zakaj je to pomembno Dviganje stanja navzgor je temeljni pristop za **deljenje stanja med bratsko/sorodno komponento** v ogrodjih, ki temeljijo na komponentah — ohrani enem mestu resnično vrednost v skupnem staršu, zato otroci ostanejo usklajeni. Glavno je *prvi* pripomoček, na katerega se poslužimo pred dodajanjem Context ali trgovine. Prepoznavanje, kdaj dvigniti (bratje se morajo usklajiti) — in kdaj je dviganje preseglo mejo (povzroči "prop drilling", zato je čas za Context/trgovino) — je bistveno za pravilno strukturiranje stanja komponente.