Quiero fusionar dos matrices separadas en una matriz de objetos
const [price, setPrice] = useState([100,200,400, 700]) const [fruits, setFruits] = useState(['apple,'orange','banana','guava']) const [sampleArray, setSampleArray] = useState([]) const mergeArray= ()=>{ setSampleArray() }el resultado debería ser así: console.log(sampleArray) [{fruta:'manzana',precio:100},{fruta:'naranja',precio:100,200,400},{fruta:'plátano',precio:400},{ fruta:'guayaba',precio:700},]
en el botónClick
<button onClick={mergeArray}>Merge Array</button>Puedes hacerlo así:
const mergeArray = []; for (i = 0; i < fruits.length; i++) { mergeArray[i] = { fruit: fruits[i], price: prices[i] }; }Así es como puedes hacerlo en una línea
const [price, setPrice] = useState([100,200,400, 700]) const [fruits, setFruits] = useState(['apple','orange','banana','guava']) const [sampleArray, setSampleArray] = useState([]) const mergeArray= ()=>{ setSampleArray(fruits.map((fr, i) => ({"fruit" : fr, "price" : price[i]}))) }Explicación: Esto mapeará la matriz existente de frutas y devolverá cada elemento como datos json con la clave de precio a la que se accede mediante el índice. También usar mapas en setState funciona más fácilmente con el cambio de estado en reaccionar. El mapa producirá una matriz como resultado y puede usarlos directamente con el cambio de estado.
Puede hacer esto usando la función de mapa para fusionar 2 columnas de matriz en una sola matriz de objetos.
let array = []; fruits.map((fruit, i) => { let json = { [fruit]: price[i] } array.push(json); }) setSampleArray(array);