1
I am studying Javascript and need to do a data filtering based on what the person type and delete in input
dynamically. I searched and could not implement in my code, I am using the useEffect()
to pick up the main news and is already working, but I can not do the search.
useEffect(() => {
api.get('/v2/top-headlines?country=br&apiKey=85444b264aa246f28c5f41494efd6e03').then(async response => {
setNews(response.data.articles)
})
});
return (
<>
<Navbar />
<div className="row px-5 input-area">
<input onChange={(e) => setSearch(e.target.value)} type="text" className="form-control text-center input-text" placeholder="Search News" />
</div>
<div className="row">
{news.map(news => (
<div className="col-md-6">
<Card img={news.urlToImage} title={news.title} description={news.description} author={news.source.name} url={news.url} key={news.source.name} />
</div> //
))}
</div>
</>
)
}
If anyone can help me I would be eternally grateful <3.
The search already picks up all the news and you will filter the data already collected or you will fetch the news when the input content changes?
– Gustavo Bordin
I want to load the page with all the content of the API, which has type a request that returns the most relevant results according to the parameter used 'country=br' if put us will bring relevant news from the US, but have another request with a parameter type search, 'q=memesdegatos' then it will fetch news related to this parameter. Dai want to put in the input onChange for it to trigger a function that searches according to that search.
– Breno Silocórb
Now my request limit the API has exceeded today, so you can only test it tomorrow =(
– Breno Silocórb