Props and States

As we’ve previously discussed, components have the same structure, but have different sets of data passed to them.

We’ll see the syntax and implementation of using states and props once we dive into React Native in the next section.

Props

Props are the properties that pass down values or information between the components.

Previously, we looked at how every entity in React Native is a component. There are parent components, which are wrappers for many smaller components. Props are used to pass data from these parent components to child components.

We can think of props as data that won’t change once the component has been rendered. Therefore, props are immutable.

For example, let’s say we pass the name of a student to the Card component. The student’s name won’t change, so it can be passed as a prop.

Syntax

You do not need to worry about remembering the syntax of props or states. We’ll be using them throughout the course, and you’ll have many opportunities to learn about and implement them.

Let’s say we have two functional components—CardWrapper and Card. The CardWrapper component consists of many Card components. So, we can say that:

• CardWrapper is a parent component.

• Card is the child component.