react-native
  1. react-native-props

React Native Props

Syntax

In React Native, props works the same way as they work in React. You can pass the data from one component to another component using props.

<CustomComponent prop1="value1" prop2={value2}/>

Example

import React from 'react';
import { Text, View } from 'react-native';

const CustomComponent = (props) => {
  return (
    <View>
      <Text>{props.prop1}</Text>
      <Text>{props.prop2}</Text>
   </View>
  );
};

export default CustomComponent;

Output

The output of the above example will be a component that displays the values of prop1 and prop2.

Explanation

Props are used for passing data from parent component to child component. Props are read-only which means that the child component cannot modify the data received through props.

Use

Props are commonly used in React Native for passing the data from one component to another.

Important Points

  • Props are passed from parent to child component only.
  • Props can only be read by the child component, not modified.
  • Props are designed to pass data from parent component to child component.

Summary

Props are used for passing data from the parent component to the child component in React Native. The props are read-only and cannot be modified by the child component. Since props are passed from parent to child, you can use them for reusing the same component with different values.

Published on: