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

305
Visualizações
Get json data from from django-rest-api with react frontend into a variable

I am new to react and javascript. I am trying to get some data INTO A VARIABLE in react from django-rest API.

I am using this variable in another function using react-beautiful-dnd.

I have the API set up and CORS also set up.

This is the output in http://127.0.0.1:8000/api/column_names/

I am trying to get this as a json object in react frontend.

const getData = async () => {
  let response = await fetch("http://127.0.0.1:8000/api/column_names/");

  let data = await response.json();
  console.log(data);  // line 29

  return data;
};
let columnFromBackend = getData();
console.log(columnFromBackend);  // line 34

This is the output

enter image description here

Is there any way to get this data into the variable columnFromBackend

I am trying to get the equivalent of this value.

let columnFromBackend = {
  idone: {
    name: "In progress",
    items: [{ id: "hjnmkjnh", content: "first" }],
  },
  idtwo: {
    name: "Todod",
    items: [],
  },
};

If I declare the variable directly like this, then this is the output that I am getting and what I am trying to get from the api.

enter image description here

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

0

You need to change your second to last line to

let columnFromBackend = await getData();

Which version of node are you using?

about 4 years ago · Juan Pablo Isaza Relatório

0

  1. Go to node_modules/react-scripts/config and open webpack.config.js file then look for module.exports and add

    experiments:{ topLevelAwait: true }

  2. Then change let columnFromBackend = getData(); to let columnFromBackend = await getData();

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