როგორ მუშაობს კომპონენტები და JSX React Native-ში?

Question

Accepted Answer

React Native იყენებს **React-ის კომპონენტის მოდელს და JSX-ს** — UI-ების აგება ხდება ხელმეორედ გამოყენებადი **კომპონენტებიდან**, რომლებიც აბრუნებენ JSX-ს. თუ იცნობთ React-ს ვებისთვის, ეს პირდაპირ გადაჯლეჯდება; მთავარი განსხვავება არის ნაციონალური კომპონენტების გამოყენება HTML ელემენტების ნაცვლად. ## კომპონენტები და JSX ```jsx // a functional component returns JSX describing the UI (using RN core components) function Greeting({ name }) { // receives props return ( Hello, {name}! {/* JSX with an embedded expression */} ); } // compose components (like React for web) function App() { return ( {/* reuse the component */} ); } ``` კომპონენტები არის ხელმეორედ გამოყენებადი UI ნაწილები (ფუნქციები, რომლებიც აბრუნებენ JSX-ს); ისინი იღებენ **props**-ს (შეყვანები) და ემალებიან ხეებში — ზუსტად ისე, როგორც React ვებში, მაგრამ ნაციონალური კომპონენტებით. ## Props და state (React ცნებები) ```jsx import { useState } from 'react'; function Counter() { const [count, setCount] = useState(0); // STATE (useState hook) return ( setCount(count + 1)}> Count: {count} {/* re-renders when state changes */} ); } ``` **Props** გადასცემს მონაცემებს კომპონენტებში; **state** (`useState` მეშვეობით) ინახავს ცვალებადი მონაცემებს, რომლებიც ტრიგერი აძლევენ ხელახლა დაკეცვას — იგივე React მოდელი, რაც ვებში. ## React ცოდნა გადაჯლეჯდება ```text ✓ Components, JSX, props, state, HOOKS (useState, useEffect, etc.), composition, keys — all the same as React for web ✓ The main difference: native components (View/Text) instead of HTML; styling differs → React developers can apply most of their knowledge directly to React Native. ``` ## რატომ არის ეს მნიშვნელოვანი კომპონენტებისა და JSX-ის გაგება React Native-ში ფუნდამენტალური იმიტომ, რომ **React Native აგებულია React-ის კომპონენტის მოდელზე**, ამიტომ მისი გაგება აუცილებელია, და მთავარი უპირატესობა ის არის, რომ **React ცოდნა პირდაპირ გადაჯლეჯდება**. კომპონენტები (ხელმეორედ გამოყენებადი UI ნაწილები, რომლებიც აბრუნებენ JSX-ს, იღებენ props-ს სახელმძღვანელოებად და ემალებიან ხეებში) და JSX (სინტაქსი, რომელიც აღწერს UI-ს ჩადებული გამოხატულებებით) არის React Native დეველოპმენტის საფუძველი — იგივე, რაც React ვებში. **Props**-ის (მონაცემების გადაცემა კომპონენტებში) და **state**-ის (`useState` hook-ის მეშვეობით, ცვალებადი მონაცემების ინახვა, რომლებიც ტრიგერი აძლევენ ხელახლა დაკეცვას) გაგება აუცილებელია იმიტომ, რომ ეს React ცნებები არის ის, თუ როგორ მიიღებენ React Native კომპონენტები მონაცემებს და მართავენ ცვლილებას — იდენტური ვებ React-ზე. მთავარი შეხედულება არის, რომ **React ცოდნა გადაჯლეჯდება**: კომპონენტები, JSX, props, state, hooks (`useState`, `useEffect` და სხვა), კომპოზიცია და მასივები ყველა ისე მუშაობენ, როგორც React ვებში, მთავარი განსხვავებები არის ნაციონალური კომპონენტების (View, Text) გამოყენება HTML-ის ნაცვლად და განსხვავებული სტილიზაცია. ეს გადაჯლეჯადობა არის მთავარი მიზეზი, რომ React Native მიმზიდველია — React/ვებ დეველოპერების დიდი რაოდენობა შეუძლია მათი არსებული ცოდნის უმეტესი ნაწილი პირდაპირ გამოიყენოთ ნაციონალური მობილური აპლიკაციების აგებისთვის, შედარებით მცირე სწავლის მრუდის სახით, რომელიც ფოკუსირებულია ნაციონალური კომპონენტებსა და პლატფორმის სპეციფიკაზე. ვინაიდან React Native ფუნდამენტალურად არის React (კომპონენტები, JSX, props, state, hooks) გამოიყენებული ნაციონალური UI-სთან, და ამ მოდელის გაგება აუცილებელია React Native აპლიკაციების აგებისთვის, მაშინ კომპონენტებისა და JSX-ის გაგება React Native-ში აუცილებელია, ფუნდამენტალური ცოდნა — React Native-ის ბირთვული პროგრამირების მოდელი, აუცილებელი აპლიკაციების აგებისთვის, და განსაკუთრებით ღირებული React/ვებ უნარების რამდენად პირდაპირ გამოყენებაში React Native მობილური დეველოპმენტისთვის.