'Changing DOM while getting result from filter ReactJS

i am working on a search function with states received from input's value , when there is no result i want to change the innerText of my div with an error text , i tried to do that with useRef but i didn't get it .

const ListDentist = () => {
const [location, setLocation] = useState("");
const listeDentistes = [{gouvernorat : "test"} ,{gouvernorat :test1}]
return(
<>
<div className="searchInput">
<input type="text" className="form-control" placeholder={"Où ?"} value={location}
                  onChange={(e) => {setLocation(e.target.value)}}
                />
</div>
<div className="listeDentistCards" id="resultdiv" ref={titleRef}>
{listeDentistes.filter((dentiste) =>
                    dentiste.gouvernorat.includes(location)
                  )
                  .map((dentiste) => (
                    <div key={dentiste._id}>
                      <DentistCard dentiste={dentiste} />
                    </div>
                  ))}
</div> 
</>
)}

Thank you for your help !



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source