List the important core components of React Native-JS Tutorial-php.cn

List the important core components of React Native

WBOY

Release： 2023-09-08 21:25:06

forward

887 people have browsed it

The most important core components in React Native are as follows-

When the app is shown in an Android device, the component will change to When the app is shown in an IOS device< The View> component will change to When seen in a web browser, the component will change to

tag

When the app appears on an Android device the component will change as When the application is seen in an IOS device, the component will change to When seen in a web browser, the component will change to the

tag

used to display text to the user. It also handles styles and touch events. When an application sees the component in an Android device will be changed to When the app is seen in an IOS device, the component will be changed to When viewed in a web browser, the component will change to the tag used to display the image. When the application is seen in an Android device, the component will change to < ;ScrollView>When the application is seen in an IOS device, the component will change to

When seen in a web browser, the component changes to a

tag

that has the component and the view's scroll container. ##TextInput - Example

React Native components	Android native view	IOS native View	Web Browser
#View-			is the core container that supports flexbox layout. It also manages touch handling.
Text -
Image -
Scrollview -
When the application is displayed in the Android device, The component will change to	When the application is displayed in an IOS device, the component will change to to	When the component is seen in a web browser, it will be changed to an tag.	An input element in which the user can enter text

Below is a working example of , , , and

To use Text, View, Image, ScrollView, TextInput you need to start from react -native import components, as shown below-

import { View, Text, Image, ScrollView, TextInput } from &#39;react-native&#39;;

Copy after login

View component is mainly used to save text, buttons, pictures, etc. The usage of this component is as follows-

<View>
   <Text style={{ padding:"10%", color:"red" }}>Inside View Container</Text>
   <Image
      source={{
         uri: &#39;https://www.tutorialspoint.com/react_native/images/logo.png&#39;,
      }}
      style={{ width: 311, height: 91 }}
   />
</View>

Copy after login

There are text and image components in it. The ScrollView component behaves like a parent component handling View, Text, Image, Button, and other React Native components.

import React from 'react';
import { View, Text, Image, ScrollView, TextInput } from &#39;react-native&#39;;

const App = () => {
   return (
      
         Welcome to TutorialsPoints!
         
            Inside View Container
            
      
      
      
   );
}
export default App;

Copy after login

Output

The above is the detailed content of List the important core components of React Native. For more information, please follow other related articles on the PHP Chinese website!