React Native के महत्वपूर्ण कोर कंपोनेंट्स की सूची

रिएक्ट नेटिव में सबसे महत्वपूर्ण कोर कंपोनेंट्स निम्नलिखित हैं:

React Native कंपोनेंट	Android नेटिव व्यू	iOS नेटिव व्यू	वेब ब्राउज़र	विवरण
View - <View>	जब ऐप एंड्रॉइड डिवाइस में देखा जाता है तो <View> कंपोनेंट <ViewGroup> में बदल जाएगा	जब ऐप iOS डिवाइस में देखा जाता है तो <View> कंपोनेंट <UIView> में बदल जाएगा	जब वेब ब्राउज़र में देखा जाता है तो <View> कंपोनेंट <div> टैग में बदल जाएगा	यह फ्लेक्सबॉक्स लेआउट का समर्थन करने वाला कोर कंटेनर है। यह टच हैंडलिंग भी मैनेज करता है।
Text - <Text>	जब ऐप एंड्रॉइड डिवाइस में देखा जाता है तो <Text> कंपोनेंट <TextView> में बदल जाएगा	जब ऐप iOS डिवाइस में देखा जाता है तो <Text> कंपोनेंट <UITextView> में बदल जाएगा	जब वेब ब्राउज़र में देखा जाता है तो <Text> कंपोनेंट <p> टैग में बदल जाएगा	उपयोगकर्ता को टेक्स्ट प्रदर्शित करने के लिए उपयोग किया जाता है। यह स्टाइलिंग और टच इवेंट्स भी हैंडल करता है।
Image - <Image>	जब ऐप एंड्रॉइड डिवाइस में देखा जाता है तो <Image> कंपोनेंट <ImageView> में बदल जाएगा	जब ऐप iOS डिवाइस में देखा जाता है तो <Image> कंपोनेंट <UIImageView> में बदल जाएगा	जब वेब ब्राउज़र में देखा जाता है तो <Image> कंपोनेंट <img> टैग में बदल जाएगा	इमेज प्रदर्शित करने के लिए उपयोग किया जाता है।
ScrollView - <ScrollView>	जब ऐप एंड्रॉइड डिवाइस में देखा जाता है तो <ScrollView> कंपोनेंट <ScrollView> में बदल जाएगा	जब ऐप iOS डिवाइस में देखा जाता है तो <ScrollView> कंपोनेंट <UIScrollView> में बदल जाएगा	जब वेब ब्राउज़र में देखा जाता है तो <ScrollView> कंपोनेंट <div> टैग में बदल जाएगा	कंपोनेंट्स और व्यूज़ वाला स्क्रॉलिंग कंटेनर।
TextInput - <TextInput>	जब ऐप एंड्रॉइड डिवाइस में देखा जाता है तो <TextInput> कंपोनेंट <EditText> में बदल जाएगा	जब ऐप iOS डिवाइस में देखा जाता है तो <TextInput> कंपोनेंट <UITextField> में बदल जाएगा	जब वेब ब्राउज़र में देखा जाता है तो <TextInput> कंपोनेंट <input type="text"> टैग में बदल जाएगा	इनपुट एलिमेंट जहां उपयोगकर्ता टेक्स्ट दर्ज कर सकता है।

उदाहरण: कोर कंपोनेंट्स का उपयोग

निम्नलिखित <View>, <Text>, <Image>, <ScrollView> और <TextInput> के साथ कार्यशील उदाहरण है।

Text, View, Image, ScrollView, TextInput के साथ काम करने के लिए, आपको react-native से कंपोनेंट्स इम्पोर्ट करने होंगे जैसा कि नीचे दिखाया गया है:

import { View, Text, Image, ScrollView, TextInput } from 'react-native';

View कंपोनेंट का उपयोग मुख्य रूप से टेक्स्ट, बटन, इमेज आदि को रखने के लिए किया जाता है। कंपोनेंट का उपयोग निम्नानुसार किया जाता है:


    Inside View Container

इसमें Text और Image कंपोनेंट हैं। ScrollView कंपोनेंट एक पैरेंट कंपोनेंट की तरह व्यवहार करता है जो View, Text, Image, Button और अन्य रिएक्ट नेटिव कंपोनेंट्स को हैंडल करता है।

import React from 'react';
import { View, Text, Image, ScrollView, TextInput } from 'react-native';
const App = () => {
    return (
        
            Welcome to TutorialsPoints!
            
                Inside View Container
                
            
            
        
    );
}
export default App;

आउटपुट

React Native के महत्वपूर्ण कोर कंपोनेंट्स की सूची