Estoy tratando de combinar dos matrices en función de una propiedad compartida que ambos tienen. ¿Cómo puedo hacer esto en reaccionar? Quiero combinarlos para crear una matriz que contenga la casilla de verificación y todos los demás elementos.
Aquí hay dos matrices de muestra:
const array1 = [ {Handle: "handle1", title: "handle1"}, {Handle: "handle2", title: "handle2"}, {Handle: "handle3", title: "handle3"} ] const array2 = [ {Handle: "handle1", checkbox: true}, {Handle: "handle2", checkbox: false}, {Handle: "handle3", checkbox: true} ]Resultado:
const array2 = [ {Handle: "handle1", checkbox: true, title:"handle1"}, {Handle: "handle2", checkbox: false, title:"handle2"}, {Handle: "handle3", checkbox: true, title:"handle3"} ]¿Cómo los combino de tal manera que obtenga una nueva matriz que contenga el identificador, el título y la casilla de verificación en los lugares correctos?
Algo como esto puede funcionar, no estoy seguro de cuánto cambiarán los datos con el nombre del objeto que desea combinar.
const array1 = [ {Handle: "handle1", title: "handle1"}, {Handle: "handle2", title: "handle2"}, {Handle: "handle3", title: "handle3"} ] const array2 = [ {Handle: "handle1", checkbox: true}, {Handle: "handle2", checkbox: false}, {Handle: "handle3", checkbox: true} ] const newArr = array1.map(v => { let obj = array2.find(o => o.Handle === v.Handle) if(obj) { v.checkbox = obj.checkbox } return v }) console.log(newArr)Te puede gustar así:
const array1 = [ {Handle: "handle1", title: "handle1"}, {Handle: "handle2", title: "handle2"}, {Handle: "handle3", title: "handle3"} ] const array2 = [ {Handle: "handle1", checkbox: true}, {Handle: "handle2", checkbox: false}, {Handle: "handle3", checkbox: true} ] const array3 = array1.map(({ Handle, title }, idx) => ({Handle, title, checkbox: array2[idx].checkbox})); console.log(array3) const array1 = [ {Handle: "handle1", title: "handle1"}, {Handle: "handle2", title: "handle2"}, {Handle: "handle3", title: "handle3"} ] const array2 = [ {Handle: "handle1", checkbox: true}, {Handle: "handle2", checkbox: false}, {Handle: "handle3", checkbox: true} ] const array3 = array1.map(({ Handle, title }, idx) => ({Handle, title, checkbox: array2[idx].checkbox})); console.log(array3)Aquí estamos usando el método map y el método Object.assign para fusionar la matriz de objetos usando id.
const array1 = [ {Handle: "handle1", title: "handle1"}, {Handle: "handle2", title: "handle2"}, {Handle: "handle3", title: "handle3"} ] const array2 = [ {Handle: "handle1", checkbox: true}, {Handle: "handle2", checkbox: false}, {Handle: "handle3", checkbox: true} ] console.log(array1.map((item1,i)=>{ if(array2.find(item2 => item2.Handle === item1.Handle)){ return Object.assign({},item1,array2.find(item2 => item2.Handle === item1.Handle)) } }))Y puedes hacer así.
const array1 = [ {Handle: "handle1", title: "handle1"}, {Handle: "handle2", title: "handle2"}, {Handle: "handle3", title: "handle3"} ] const array2 = [ {Handle: "handle1", checkbox: true}, {Handle: "handle2", checkbox: false}, {Handle: "handle3", checkbox: true} ] let mergedarray = array1.map(itm => ({ ...array2.find((item) => (item.id === itm.id) && item), ...itm })); console.log(mergedarray)