Si funksionojnë komponentët dhe props në Vue?

Question

Accepted Answer

**Komponentët** janë pjesë të ripërdorshme, të pavarura të ndërfaqes. **Props** janë mënyra se si një komponentë prind i kalon të dhënat *poshtë* komponentës fëmije — ato janë hyrjet e tipit të komponentës fëmije, vetëm për lexim. ## Përcaktimi i props në komponentën fëmije ```vue ``` ## Kalimi i props nga komponentja prind ```vue ``` Shënoni ndryshimin: `name="Ann"` kalon një varg literal, ndërsa `:age="30"` (me `v-bind`) vlerëson një shprehje — e nevojshme për numra, vlera boolean, objekte ose variabla. Gjithashtu, emrat e prop në JS janë `camelCase` por në template janë `kebab-case` (`isAdmin` → `:is-admin`). ## Props janë njëkahësh dhe vetëm për lexim ```js props.name = "Bob"; // ❌ Vue warns — never mutate a prop ``` Te dhënat rrjedhin **poshtë** (prind → fëmije). Një komponentë fëmije nuk duhet të ndryshojë props-at e saj; nëse duhet të ndryshojë diçka, ose përdor një kopje lokale ose **emeton një ngjarje** për të kërkuar nga prindi që ta ndryshojë burimin ("props poshtë, ngjarje lart"). Ky rrjedh njëkahësh e mban të dhënat të parashikueshme. ## TypeScript props ```vue ``` ## Pse është e rëndësishme Komponentët dhe props janë themeli i arkitekturës Vue — ju ndërtoni ndërfaqet nga komponentë të ripërdorshme dhe i konfigurojini ato përmes props. Kuptuese që props janë **njëkahësh dhe vetëm për lexim** (të dhëna poshtë, ngjarje lart) është modeli themelor i mentalitetit që e mban aplikacionin Vue të parashikueshëm; ndryshimi i props ose pritshmëria e rrjedhjes dykahuese të prop është një burim klasik i gabimeve.