Different way props

Step -1

const Gretting=({gretting})=>{
return(
<div>
<h1>{gretting}</h1>
</div>
)}
class App extends Component {
render() { 
return ( 
<Gretting gretting='Hello App js'/>
);
}}
export default App;
...........................................................................................................................................................................................................................

Step -2

const Gretting=(props)=>{
return(
<div>
<h1>{props.gretting}</h1>
</div>
)}

class App extends Component {
render() { 
return ( 
<Gretting gretting='Hello App js'/>
);
}}

export default App;

.................................................................................................................................................................................................................................

Step -5

const Gretting=(props)=>{

  return(

    <div>

      <h1>{props.gretting}</h1>

    </div>

  )}

class App extends Component {

  

  render() { 

    const gretting='welcome react js'

    return ( 

      <Gretting gretting={gretting}/>

     );

  }}

 

export default App;

.................................................................................................................................................................................................................................
Step -4

const Gretting=({gretting})=>{
  return(
    <div>
      <h1>{gretting.text}</h1>
    </div>
  )}

class App extends Component {
  render() { 
    return ( 
      <Gretting gretting={{text: "welcome react js"}}/>
     );
  }}
export default App;

.................................................................................................................................................................................................................................
Step -5


.................................................................................................................................................................................................................................



.................................................................................................................................................................................................................................



.................................................................................................................................................................................................................................


.................................................................................................................................................................................................................................


.................................................................................................................................................................................................................................




.................................................................................................................................................................................................................................