Do function components have props in React?

Viewed 4795

Can we use props in function components in React, and if then, how?I was trying to do

console.log(this.props) 

above the return function in a function component but it kept giving me errors.

3 Answers

Yes. You pass the props inside the function component directly (using props) like this:

function myFunc(props){
  console.log(props.content);
  return <div>{props.content}</div>;
}

assuming that the props that passes in has element content.

To clarify, there is no this in function components because they're not classes at all! Instead, you pass in props directly into the function.

In fact, it is probably the one of the first things that you learn in React. So if you're new, then I suggest the tutorial here.

You can access "this" keyword in class component ... In functional component you can access the props just by calling it as below.

import React from 'react'

const Printing=(props)=> {
    console.log(props)
    return (
        <div>
            
        </div>
    )
}
export default Printing
Related