function MyComponent (props) {
const [isActive, setActive] = useState(false);
const toggleClass = () => {
setActive(!isActive);
};
return (
<div
className={isActive ? 'your_className': null}
onClick={toggleClass}
>
<p>my text</p>
</div>
);
}const [show,setShow]=useState(true)
return (
<div className="App">
{
show?<h1>Hello World !</h1>:null
}
<button onClick={()=>setShow(!show)} >Toggle</button>
</div>
);import React, { useState } from "react";import "./styles.css";
export default function App() {
const [isActive, setActive] = useState("false");
const handleToggle = () => {
setActive(!isActive); };
return (
<div className={isActive ? "app" : null}> <h1>Hello react</h1>
<button onClick={handleToggle}>Toggle class</button> </div>
);
}