No puedo buscar en Google la solución correcta para esto durante aproximadamente una hora seguida, así que recibo una respuesta de la API que se ve así:
[ { "Name": "name1", "Title": "Name One", "Children": [ { "Name": "Name 1.1", "Title": "Name one point one" }, ]
Y necesito que se ajuste a este tipo de "molde" para que los datos encajen:
{ title: 'Name One', value: 'name1', key: '1', children: [ { title: 'Name one point one', value: 'Name 1.1', key: 'key1', },
Estoy tratando de lograr esto usando un foreach, pero no funciona según lo previsto porque necesito hacer todo esto en una instancia de foreach. Esto es lo que probé (vue2):
created() { getData().then(response => { const formattedResponse = [] response.forEach((el, key) => { formattedResponse.title = response.Title formattedResponse.name = response.Name formattedResponse.children = response.Children }) })
Use el map
sobre la matriz principal y use la asignación de desestructuración para extraer las propiedades por clave, y vuelva a etiquetarlas, y luego haga exactamente lo mismo con la matriz children
. Luego devuelva la matriz actualizada de objetos.
const data=[{Name:"name1",Title:"Name One",Children:[{Name:"Name 1.1",Title:"Name one point one"}]},{Name:"name2",Title:"Name Two",Children:[{Name:"Name 1.2",Title:"Name one point two"}]}]; const result = data.map((obj, key) => { const { Title: title, Name: value } = obj; const children = obj.Children.map(obj => { const { Title: title, Name: value } = obj; return { title, value, key: (key + 1).toString() }; }); return { title, value, children }; }); console.log(result);
Su respuesta API es JSON. Todo lo que necesitas hacer es:
var resp=JSON.parse(API response);