Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

189
Visualizações
How to filter json api data with condition using react

i'm getting this data from backend api. How can i add filter into json data? For Example if user want keywords which has search volume more than 20000. how can i do that? i appreciate your help in advance

about 4 years ago · Juan Pablo Isaza
2 Respostas
Responde à pergunta

0

Great question.

When gathering data from a backend api, in react here's how you would do it:

const [fetchedData, setFetchedData] = React.useState(null);

function fetchData() {
    fetch('http://example.com/movies.json')
  .then(response => response.json())
  .then(data => setFetchedData(data));
};


// loads data initially on page load
React.useEffect(() => {
  fetchData()
  }, [])
  

//use this function to tie to an "onChange" or "onClick" event when submitting the values.
function filterData(inputValue) {
  if(inputValue === "") return;

  
  const filteredData = fetchedData.filter((value) => {
  return value.SEARCH_INDEX_VALUE_HERE >= inputValue
  }
  
  return filteredData;
}



  

You can find a good description from here

This is given that the data returned is an array of objects, and the the SEARCH_INDEX_VALUE_HERE is whatever column key that is provided to the data you're filtering. In your case, it would be the "Search value" field I believe.

about 4 years ago · Juan Pablo Isaza Relatório

0

You can use filter method of JavaScript like this.

var filteredData = data.filter(function (item)
{
  return item.Search_volume >=20000;
         
}
);
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda