Entonces, estoy extrayendo dos matrices de una API para una tabla de datos Vue.JS, una de las matrices contiene un objeto con información para la tabla sobre dispositivos específicos, como nombres, ID, fechas, etc., mientras que la otra matriz contiene un objeto con varios estados, como "perdido", "sin señal", etc.
Necesito fusionar estas matrices e ingresarlas en un nuevo objeto, que luego se almacenará en una nueva matriz para DataTable:
let data = { name: name, IDs: id, date: date warning: null, error: null }La matriz con estados, matriz 2, dicta los valores de "advertencia" y "error", y necesito recorrer e ingresar cada objeto de "datos" en una nueva matriz con cada advertencia o error individual, por lo que si "lowSignal" Y "perdidos" son verdaderos, entonces la tabla de datos tendrá dos entradas, una donde la columna de advertencia se llena con "lowSignal" y la columna de error no tiene nada, y otra donde la columna de error se llena con "perdidos" y la advertencia no tiene nada en eso.
Esto es lo que probé: tener múltiples condiciones if para cada posible error, como if (lowSignal), if (lost), etc., con cada instrucción if que contiene una nueva variable establecida para representar el objeto de datos, let temp = data; , luego configuraría y fusionaría: temp.warning = lowSignal, merge.push[temp] Esto no funcionó, como si tanto lowSignal AND lost fueran verdaderos, ingresaría dos entradas en DataTable (lo cual es correcto), pero ambos las entradas tendrían una advertencia y un error rellenados con lo mismo (incorrecto). También intenté tener un bucle .forEach, así como un bucle de longitud de objeto, ambos devolviendo el mismo resultado.
¿Alguna sugerencia? Gracias
Puede usar el Operador de extensión para fusionar dos objetos. Si tiene una propiedad en una matriz relacionada con una propiedad en la otra matriz ( device.id y status.deviceId ), puede hacer algo similar a esto:
const devices = [ { id: 1, name: 'Device A', }, { id: 2, name: 'Device B', }, { id: 3, name: 'Device C', }, { id: 4, name: 'Device D', }, ] const statuses = [ { id: 1, deviceId: 1, warning: 'low signal', error: 'lost' }, { id: 2, deviceId: 2, warning: 'low signal', error: null }, { id: 2, deviceId: 3, warning: null, error: 'lost' }, { id: 2, deviceId: 3, warning: null, error: null } ] const devicesWithStatus = devices.reduce((acc, device) => { // Find the status where deviceId equals to the ID of the device const status = statuses.find((status) => status.deviceId === device.id) // If there's a warning, merge the device and the warning if(status?.warning) acc.push({ ...device, warning: status.warning }) // If there's an error, merge the device and the error if(status?.error) acc.push({ ...device, error: status.error }) // If there's no error or warning, just push the device if(!status?.error && !status?.warning) acc.push(device) return acc }, []) console.log(devicesWithStatus)Si te entendí correctamente, prueba con el siguiente fragmento:
const arr = [{id: 0, name: 'a', desc: 'ddd'}, {id: 1, name: 'b', desc: 'ddd'}, {id: 2, name: 'c', desc: 'ddd'}, {id: 3, name: 'd', desc: 'ddd'}] const stat = [{id: 0, lost: true, lowSignal: true}, {id: 1, lost: false, lowSignal: true}, {id: 2, lost: true, lowSignal: false}] const res = [] arr.forEach(a => { let st = stat.find(s => s.id === a.id) let newObj = { id: a.id, name: a.name, error: null, warning: null } if(st) { if(st.lost) { res.push({ ...newObj, error: 'lost' }) } if (st.lowSignal) { res.push({ ...newObj, warning: 'lowSignal' }) } } else { res.push({ ...newObj }) } }) console.log(res)