What is lifting state up in React?

Lifting state up means moving state to the nearest common ancestor when multiple

components need to share or modify it.

✅ Example:

function Parent() {

const [value, setValue] = useState("");
return (

<>

<Input value={value} onChange={setValue} />

<Display value={value} />

</>

);

}

function Input({ value, onChange }) {

return <input value={value} onChange={e =>

onChange(e.target.value)} />;

}

function Display({ value }) {

return <p>{value}</p>;
}

React Hooks