/Javascript/React/How to pass a component as a prop in react

How to pass a component as a prop in react

Pass props in react

/* PASSING THE PROPS to the 'Greeting' component */
const expression = 'Happy';
<Greeting statement='Hello' expression={expression}/> // statement and expression are the props (ie. arguments) we are passing to Greeting component

/* USING THE PROPS in the child component */
class Greeting extends Component {
  render() {
    return <h1>{this.props.statement} I am feeling {this.props.expression} today!</h1>;
  }
}

How to pass a component as a prop in react

const Parent = () => { 
  return (
    <Child  componentToPassDown={<SomeComp />}  />
  )
}

const Child = ({ componentToPassDown }) => { 
  return (
    <>
     {componentToPassDown}  
    </>
  )
}

Source: stackoverflow.com

Similar codes

1 vote100 views1 answer
Adding int and string in react props
Javascript React
0 vote93 views1 answer
React-native how to get size of screen
Javascript React
0 vote107 views3 answers
Line 32:18: 'Link' is not defined react/jsx-no-undef
Javascript React
0 vote100 views2 answers
How to add fcc cdn to local react projcet
Javascript React
66 votes112 views6 answers
Routing react
Javascript React
5 votes118 views4 answers
How to get url in react
Javascript React
11 votes115 views4 answers
How to check for react version
Javascript React
1 vote131 views1 answer
React render html variable
Javascript React
0 vote112 views1 answer
Backgroundcolor react
Javascript React
0 vote109 views1 answer
React native bottom bar curved
Javascript React