/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

3 votes207 views2 answers
Handle onchange react
Javascript React
0 vote215 views1 answer
Import button react-bootstrap
Javascript React
1 vote242 views1 answer
Shopping cart small icon code react-bootstrap 4.6 fa fas
Javascript React
12 votes274 views3 answers
Font weight react native
Javascript React
1 vote269 views2 answers
Generate apk debug react native
Javascript React
0 vote234 views1 answer
React features
Javascript React
0 vote232 views1 answer
Type '{ GlobalState: any; Dispatch: React.Dispatch<any>; }' is not assignable to type 'null'
Javascript React
0 vote252 views1 answer
React receiving socket muitple times
Javascript React
5 votes264 views1 answer
React native backgrunde img
Javascript React
0 vote224 views1 answer
How to insalk react router with npm
Javascript React