Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

311
Vistas
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 Respuestas
Responde la pregunta

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 Denunciar

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 Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda