Nuevo en Javascript.
Descubrí cómo recuperar datos de un tablero de Monday.com, y se devuelve como un valor JSON como este:
{
"boards": [
{
"items": [
{
"column_values": [
{
"id": "location",
"title": "Location",
"type": "location",
"text": "Cape Town, South Africa"
}
]
},
{
"column_values": [
{
"id": "location",
"title": "Location",
"type": "location",
"text": "Paris, France"
}
]
},
{
"column_values": [
{
"id": "location",
"title": "Location",
"type": "location",
"text": "New York, NY, USA"
}
]
}
]
}
]
}
Hay 3 artículos aquí, pero esta cantidad puede ser cualquier cosa.
Necesito obtener el texto de la ubicación (por ejemplo, "Ciudad del Cabo, Sudáfrica") y luego necesito usarlo más tarde en una llamada a la API para obtener el clima de esta ubicación.
Finalmente logré mostrar en la consola la ubicación, así:
console.log(JSON.stringify(this.state.boardData.boards[0].items[0].column_values[0].text));
Obviamente, esto muestra lo que quiero, pero solo el valor del primer elemento.
Necesito hacer esto dinámicamente para obtener todas las ubicaciones, y necesito almacenar esto en variables, de modo que luego pueda hacer una llamada a la API para obtener el clima de cada una de las 3 (o más) ubicaciones.
Estoy totalmente perdido y he estado luchando durante horas. Una vez que logre hacer esto, todavía no tengo idea de cómo haré la llamada a la API, pero una cosa a la vez :)
Otro enfoque:
const rawData = {boards:[{items:[{column_values:[{id:"location",title:"Location",type:"location",text:"Cape Town, South Africa"}]},{column_values:[{id:"location",title:"Location",type:"location",text:"Paris, France"}]},{column_values:[{id:"location",title:"Location",type:"location",text:"New York, NY, USA"}]}]}]};
const locations = [];
for (const board of rawData.boards) {
for (const item of board.items) {
for (const value of item.column_values) {
locations.push(value.text);
}
}
}
console.log(locations);
Puede extraer el text con cierta cantidad de .map anidado. Tableros de mapa => elementos de mapa => valores de columna de mapa. Obtendrá una matriz de matrices de matrices. Y luego puede aplicar .flat() para desenvolverlos todos. ( .flat(Infinity); también se puede usar)
const apiData={boards:[{items:[{column_values:[{id:"location",title:"Location",type:"location",text:"Cape Town, South Africa"}]},{column_values:[{id:"location",title:"Location",type:"location",text:"Paris, France"}]},{column_values:[{id:"location",title:"Location",type:"location",text:"New York, NY, USA"}]}]}]};
const locations = apiData.boards
.map((board) => board.items.map((i) => i.column_values.map((cv) => cv.text)))
.flat(2);
console.log(locations);
Entonces, en javascript tenemos un mapa de función de matriz, con el cual podemos iterar sobre la matriz que se puede usar aquí. Se vería algo como esto:
let arr = boards[0].items.map(element => element.column_values[0].text)
y este arr contendrá la lista de todos los nombres de ciudades, que puede usar para enviar los datos a la API.
(Editar: considerando column_values como una matriz con un solo elemento y los elementos pueden tener múltiples elementos)