როგორ მუშაობს props და state-ი React Native-ში?

Question

Accepted Answer

**Props** და **state** არის React-ის ძირითადი კონცეფციები, რომლებიც React Native-ში იდენტიურად მუშაობენ: **props** კომპონენტში მონაცემებს გადასცემს (მხოლოდ წაკითხვადი inputs), ხოლო **state** იმ მონაცემებს ინახავს, რომლებიც დროთა განმავლობაში შეიძლება შეიცვალოს (რაც გადახატვას იწვევს). მათი გაგება ფундამენტურია. ## Props — გადაცემული მონაცემები (მხოლოდ წაკითხვადი) ```jsx // props are inputs passed to a component (from its parent) — READ-ONLY function UserCard({ name, age }) { // receives props return {name}, {age}; } // pass props when using the component // → props flow DOWN (parent → child); a component doesn't change its own props ``` ## State — მონაცემები, რომლებიც იცვლება (useState-ის მეშვეობით) ```jsx import { useState } from 'react'; function Counter() { const [count, setCount] = useState(0); // declare state + its setter return ( setCount(count + 1)}> {count} {/* uses state */} ); } // → calling setCount updates state → component RE-RENDERS with the new value ``` State არის შიდა, შეცვლადი მონაცემი; მისი განახლება (`useState`-ის setter-ის საშუალებით) გადახატვას იწვევს — ასე ის მოჩანს, თუ როგორ ჰქმნის UI ცვლილებებს. ## Props vs state ```text PROPS → passed IN from the parent; READ-ONLY (the component doesn't change them); for configuration/data from outside STATE → internal to the component; CHANGEABLE (via setState/useState); triggers re-renders; for data that changes over time (user input, toggles, fetched data) → Data flows DOWN via props; state changes drive UI updates. (Same as React for web.) ``` ## რატომ აქვს ეს მნიშვნელობა Props და state-ის გაგება ფундამენტურია React Native-ში, რადგან ისინი არიან **React-ის ძირითადი კონცეფციები, რომლებიც ცენტრალური როლს თამაშობენ იმაში, თუ როგორ მუშაობენ კომპონენტები და როგორ განახლდება UIs**, ამიტომ ეს აუცილებელი ცოდნაა. **Props** (მხოლოდ წაკითხვადი მონაცემები, რომლებიც გადაცემულია კომპონენტში მისი მშობლიდან, კომპონენტის ხეზე ქვევით მოძრაობენ) არის ის, თუ როგორ მიიღებს კომპონენტი კონფიგურაცია და მონაცემებს გარედან, რაც უმკაო, კომპოზიციული კომპონენტებს შესაძლებელს ხდის. **State** (შიდა, შეცვლადი მონაცემი, რომელიც `useState` hook-ის მეშვეობით არის მართული, სადაც მისი განახლება გადახატვას იწვევს) არის ის, თუ როგორ ინახავს კომპონენტი და აპასუხებს მონაცემებს, რომლებიც დროთა განმავლობაში იცვლება (მომხმარებლის input, toggle-ები, მოძებნილი მონაცემები) — მექანიზმი, რომლითაც UIs ჰქმნის ცვლილებებს. ის **განსხვავება**ს გაგება — props გადაცემული და მხოლოდ წაკითხვადი (გარე მონაცემებისა და კონფიგურაციისთვის) ვერსუსი state-ი შიდა და შეცვლადი (მონაცემებისთვის, რომლებიც იცვლება, გადახატვას ქმნის) — და პრინციპი, რომ **მონაცემები props-ის მეშვეობით ქვევით მოძრაობენ, სანამ state-ის ცვლილებები UI განახლებებს მართავენ** ფундამენტურია React Native (და React) აპლიკაციების სწორად აშენებისთვის. ეს ზუსტად იგივე კონცეფციებია, რაც React web-ისთვის, ამიტომ მათი გაგება პირდაპირ გადაიტანება და აუცილებელია ყველასთვის, ვინც React Native კომპონენტებს აშენებს. Props და state-ის სწორად გაკეთება (მონაცემების გადაცემა props-ის მეშვეობით, შეცვლადი მონაცემის მართვა state-ით, ცალმხრივი მონაცემთა ნაკადის გაგება) არის ფუნქციური, სწორი კომპონენტების ბირთვი. ვინაიდან props და state არის ცენტრალური იმაში, თუ როგორ მუშაობენ React Native (და React) კომპონენტები — მონაცემების მიღება (props) და ცვლილების მართვა (state) UI განახლებების გასაქმოსთვის — და მათი გაგება ფундამენტურია ნებისმიერი React Native აპლიკაციის სწორად აშენებისთვის, props და state-ის გაგება აუცილებელი, ფუნდამენტური React Native ცოდნაა — ძირითადი კონცეფციები, რომლებიც ყველა React Native დეველოპერმა უნდა გაიგოს, იდენტური web React-ის (ამიტომ ცოდნა გადაიტანება) და ფუნდამენტური კომპონენტების აშენებისთვის, რომლებიც მონაცემებს იღებენ და ცვლილებებზე გამოეხმიანებიან, React Native UI განვითარების ძირითადი მექანიზმი.