React.js props in functional component

In a React functional component, you can access props passed to the component as an argument to the function. Here is an example of a functional component that receives props:

import React from 'react';

function MyComponent(props) {

  return <div>{props.message}</div>;

}

export default MyComponent;

In this example, the MyComponent function receives an object called props as an argument. The props object contains all of the properties passed to the component when it is used in another component.

You can also use destructuring assignment to extract specific props from the props object, like this: 

function MyComponent({ message, userName }) {

  return <div> {userName} : { message }</div>;

}

You can then pass values for message and userName as props when you use the MyComponent in another component: 

<MyComponent message="Hello World!" userName="John"/>

Keep in mind that, when you use destructuring assignment, the properties that you extract must be present in the props object. If they are not present, you will get undefined.