How to show form validation error in react

I do all thing my validation message can print on console but not on page i want my validation error can also shown on form

this is my App.js i use react 18.2.0 version on my machine

I use this as shown error on page <p style={{color: "Red"}}>{errors ? errors.Name : ” }

import React, { useState } from "react";

function App(){

  const[Name,setName]= useState('');
  const[Email,setEmail]=useState('');
  const[Password,setPassword]=useState('');
  const errors={};


  const handleChange = (e) =>{
    console.log(e.target.value);
    setName(e.target.value);

  }
  const handleEmailChange =(e)=>{
    setEmail(e.target.value);
  }
  const handlePasswordChange =(e)=>{
    setPassword(e.target.value);
  }

  const handleSubmit = event => {
    event.preventDefault();
    console.log(`Name:  ${Name}  \n
            email: ${Email} \n
            Password: ${Password} \n `);
  //console.log(typeof(Name))
            if(!Name || !Email || !Password) {
              console.log('here');
             
                errors.Name="All Fields Are Required!";
            console.log(errors)
                 // return errors;

            }
  };
return(
    <div>
      <h1>Form</h1>
      <form onSubmit={handleSubmit}>
        <div>
        <label>Enter Your Name: </label>
        <input type="text" value={Name} onChange={handleChange}></input>
        </div>
        <p style={{color: "Red"}}>{errors ?  errors.Name : '' }</p>
        <div>
        <label>Enter your Email:  </label>
        <input type="email"  value={Email} onChange={handleEmailChange}></input>
        </div>
        {/* <p style={{color: "Red"}}>{FormErrors.Email}</p> */}
        <div>
        <label>Enter your Password:  </label>
        <input type="password"  value={Password} onChange={handlePasswordChange}></input>
        </div>
        {/* <p style={{color: "Red"}}>{FormErrors.Password}</p> */}
        <button>Submit</button>
      </form>
    </div>
  );
}

>Solution :

react is not able to re-render your component instead use useState to setErrors

try this

 const [errors, setErrors] = useState({});

 
  const handleSubmit = (event) => {
    event.preventDefault();
    console.log(`Name:  ${Name}  \n
            email: ${Email} \n
            Password: ${Password} \n `);
    //console.log(typeof(Name))
    if (!Name || !Email || !Password) {
      console.log("here");
      setErrors({ Name: "All Fields Are Required!" });
       console.log(errors);
     
    }
  };