Passing Data Through Props

Learn about React props and how they’re passed into components.

We'll cover the following...

Props

Props in React refer to the properties or input that can be passed into a component. React can render dynamic data. One of the ways it does so is by passing props.

Let’s see an example below:

import React from "react";


const Greeting = () => {
  return <div>
           <h1>Good morning Ikenna!</h1>
         </div>

}

export default Greeting;
React component

The widget above is a simple React application that consists of two components. These are the App component, which is the parent component, and another component called Greeting, which is the child of the App component.

The Greeting component renders an h1 tag with a good morning message to a person named Ikenna. When we click the “Run” button, an h1 tag is displayed with the phrase Good Morning Ikenna. This ...