Estoy tratando de agregar un objeto en la matriz definida en el estado, que (objeto) obtengo de un niño y luego me muevo hacia el padre, lo configuro en el estado del padre y se lo doy a otro (el código de ese niño está abajo) niño como apoyo. Vi algunas soluciones pero no están funcionando. La solución actual me da un bucle infinito, el elemento de accesorios se agrega una y otra vez. Entonces, mi pregunta es cómo agregar un elemento en la matriz que se define en el estado y el elemento que estamos obteniendo es un accesorio. Aquí está mi código

 import React, { Component } from "react"; import "./ShoppingCart.css"; class ShoppingCart extends Component { constructor(props) { super(props); this.state = { items: [], }; } onAddItem = () => { if(Object.keys(this.props.item).length !== 0) //checking initial empty prop { const item = this.props.item; //an object consist of {id,title,price...etc} //the solution i found on the internet const newList = this.state.items.concat(item); console.log("New List",newList); this.setState({ items:newList }) } }; render() { this.onAddItem(); return ( <React.Fragment> <button className="cart-button"> <img className="shopping-cart-img" src="./images/shopping-cart.png" /> {/* Here will be some code*/} </button> </React.Fragment> ); } } export default ShoppingCart;