React JS 19 Tutorial in Hindi #45 Lifting State Up in React js
What is Lifting state up
Make two component
Share data between two component
Interview Questions
In React, "Lifting State Up" is the process of moving state to the nearest common ancestor of two or more components that need to share or sync that state.
import { useState } from "react"
import AddUser from "./AddUser";
import DisplayUser from "./DisplayUser";
function App() {
const [user,setUser]=useState('')
return (
<div>
<AddUser setUser={setUser} />
<DisplayUser user={user}/>
</div>
);
}
export default App;
function AddUser({setUser}){
return(
<div>
<h1>Add User </h1>
<input type="text" onChange={(event)=>setUser(event.target.value)} placeholder="Enter User name" />
<hr />
</div>
)
}
export default AddUser
function DisplayUser({user}){
return(
<div>
<h3>{user}</h3>
</div>
)
}
export default DisplayUser