Estoy utilizando React (soy principiante), estoy realizando una petición a una API
, básicamente estoy haciendo una búsqueda de un producto por el nombre, pero el problema esta en que quiero mostrar texto html
cuando el usuario escriba algo que no se encuentre en la API
, he intentado realizando condiciones y nada, hice una prueba escribiendo cualquier cosa y este me retorna un array
vacío. El código es el siguiente:
const Business = () => {
const [info, setInfo] = useState([]);
const [query, setQuery] = useState('chicken');
/* searh component */
const [inputText, setInputText] = useState("");
const exampleReq = `direccion del api`;
useEffect(() => {
getRecepies();
}, [query]);
const getRecepies = async() =>{
const response = await fetch(exampleReq);
const data = await response.json();
setInfo(data.hits);
}
const getSearch = e => {
e.preventDefault();
setQuery(inputText)
}
return (
<>
<Header />
<div class="container-workers">
<Search
setInputText={setInputText}
getSearch={getSearch}
/>
<div class="each-worker">
{info.map(infos =>(
<CardBusiness
key={infos.recipe.label}
title={infos.recipe.label}
img={infos.recipe.image}
/>
))}
</div>
</div>
</>
)
}
Estoy consumiendo una api de una pagina web. De antemano gracias.