I want to add the active class on an element in componentOne on the button click in componentTwo. I am using useState for it but I don't know how to pass the state into another component. The componentTwo is the child of the componentOne.
I want the active class componentOne as long as the button is not clicked again even when the browser loads again
just create a state in the parent component and pass it down as a prop
cosnt [active , setActive] =useState(false)
<ParentComponent>
<componentOne active={active} , setActive={setActive} />
<componentTwo active={active} , setActive={setActive} />
</ParentCompnent>
Component One :
const ComponentOne = ({active}) => {
return(
<div className={`${active && 'activeClass'}`}></div>
)
}
Component Two :
const ComponentTwo = ({setActive}) => {
return(
<button onClick={()=> setActive(true)}>
)
}