event Handeling in react

 import React, { useState } from "react";

function Ap(){

const [headingtag,setheaingteg] = useState("yoyo");

const [ismouseover,color] = useState(false);

function handel(){

setheaingteg("submited")

}

function jscolor(){

color(true);

}

function js(){

color(false);

}

return(

<div className="cent">

<h1>{headingtag}</h1>

<input type="text" placeholder="Type your Name" />

<button

onMouseOut={js}

onMouseOver={jscolor} onClick={handel} style={{backgroundColor: ismouseover ? "yellow" : "white"}}

>Click Hear</button>

</div>

)

}

export default Ap;

// in this we are trying to handel the event with the help of some

function like over and out js function and also manageing states

and added on ternery operator