What is Props in React Native Explained Tutorial with Example

There are various types of components available in React Native. Each component has its unique task. Props are used to customize the components by giving them different parameters. Each component has its infrequent ability to customize the component.

For Example : In this tutorial we would going use component Image to show image in application and to gain control of Image, we would use Prop named as source . Source controls what shows inside Image component. Like we can show a local image or also can show image from HTTP URL.

Source Code for index.android.js file :

Screenshot  :

Next step is to make your own component with Props. So now we would make a single Text component and by using Props we can call it anywhere in our application with various styles.

Source Code for index.android.js file  with own Props :

What we are doing in above code :

In above code we have created a extra class named as HelloClass. Inside that class we would create a Text component. Now we would set this component as Props using this.props.StudentName . The Prop value is Hello. Now we would call that Prop into our Main Myproject class View component using ClassName PropName .

Screenshot :

Props

Leave a Reply

Your email address will not be published. Required fields are marked *