X'inhu d-differenza bejn watch u watchEffect?

Question

Accepted Answer

Iż-żewġ fil-qosor tal-effetti tal-ġenb f'rispons għal bidliet reattivi, iżda huma jidifferenzzjaw kif jiġu speċifikati d-dipendentzi u x'informazzjoni jigħtu. Għerixhom għal effetti tal-ġenb (sejħat API, logging, xogħol DOM manwali) — **mhux** għad-derivazzjoni tal-valuri (dak huwa `computed`). ## watch — sors esplicitu, jagħti valuri għal qabel + ġodda ```vue ``` `watch` josserva **sors speċifiku** li tippreciza, jħeġġeġ il-callback biss meta dak is-sors jinbidel, u jipprovdi d-**valuri għal qabel u ġodda** — utli meta għandek bżonn tqabblihom jew tirreaġixxu għal parti waħda ta' stat speċifiku. ## watchEffect — traċċar tal-dipendentzi awtomatiku, jixxeħħeq immedjatament ```vue ``` `watchEffect` **traċċa awtomatikament** kull valur reattiv użat ġewwa tiegħu (l-ebda lista ta' sorsi), u jixxeħħeq **immedjatament fuq il-konfigurazzjoni** (mbagħad jiċċyklax għal kull bidla ta' dipendentzi). L-ebda valuri għal qabel/ġodda. ## Ġenb sal-ġenb ```text watch watchEffect Dependencies explicit (you name them) automatic (tracked from usage) Runs immediately? no (unless immediate:true) yes Old + new values? yes no Best for reacting to specific state, running an effect that depends needing prev value on several values ``` ## Għażliet utli tal-watch ```js watch(source, cb, { immediate: true, // run once right away (like watchEffect) deep: true, // watch nested object changes }); watch([a, b], ([newA, newB]) => {}); // watch multiple sources ``` ## Għaliex huwa importanti Il-għażla tal-għodda t-tajba żżomm l-effetti reattivi tal-ġenb nadif: uża **`computed`** għal valuri derivati, **`watch`** meta għandek bżonn tirreaġixxu għal sors speċifiku jew tqabbal qabel/ġodda (eż. fetch meta jinbidel id), u **`watchEffect`** għal effetti li jiddipendew fuq diversi valuri u għandhom jitraċċaw awtomatikament. L-ibeħħes tal-ossirvanti għad-derivazzjoni (minflok `computed`) huwa anti-pattern komuni.