Estoy usando ReactJs y React-dom en la versión 17.02.
Tuve el mismo problema descrito en esta pregunta : un valor para incrementar y disminuir usando el botón. Usé la solución propuesta, cambié mi código anterior.
De este:
handleDecrement = card => { let cards = [...this.state.cards]; let id = cards.indexOf(card); cards[id] = {...card }; cards[id].quantità --; this.setState({ cards }); }A este:
handleDecrement = card => { let cards = [...this.state.cards]; let id = cards.indexOf(card); cards[id] = {...card }; cards[id].quantità = card[id].quantità > 0 ? (card[id].quantità - 1) : 0; this.setState({ cards }); }Pero veo este error en la consola TypeError: No se pueden leer las propiedades de undefined (leyendo 'quantità') Sé el significado pero no puedo entender POR QUÉ veo este error si "quantità" (cantidad) es un accesorio establecido en cero:
state = { cards: [ {id:0, nome: 'California', prezzo: 1.99, immagine: california, quantità:0}, {id:1, nome: 'Dragon', prezzo: 3.49, immagine: dragon, quantità:0}, {id:2, nome: 'Dynamite', prezzo: 2.49, immagine: dynamite, quantità:0}, {id:3, nome:'Philadelphia', prezzo:0.99, immagine: philadelphia, quantità:0}, {id:4, nome:'Rainbow', prezzo:2.99, immagine: rainbow, quantità:0}, {id:5, nome:'Shrimp', prezzo:1.49, immagine: shrimp, quantità:0} ] }No mostró de dónde proviene la referencia a la card en handleDecrement , pero en algún lugar se cambia la referencia para que no funcione en indexOf. En su lugar, cree una nueva lista y evite usar la mutación.
handleDecrement = card => { const cards = this.state.cards.map(c => c.id === card.id ? {...c, quantità: Math.max(0, c.quantità - 1)} : c); this.setState({ cards }); }