0
155
VistasActualización del estado cuando el estado es una matriz de objetos. Reaccionar
Estoy trabajando en un carrito de compras en reaccionar usando contexto. Mi problema es cambiar el estado que tiene una matriz de objetos.
Mi matriz se verá así [{itemId: 'ps-5', qty:4}, {itemId: 'iphone-xr', qty:2}]
Aquí está mi código revisa el comentario
export const CartContext = createContext() class CartContextProvider extends Component { state = { productsToPurchase: [] } addProduct = (itemId)=> { if (JSON.stringify(this.state.productsToPurchase).includes(itemId)){ // Add one to the qty of the product this.state.productsToPurchase.map(product=>{ if (product.itemId === itemId){ // This is wrong I have to use setState(), but the syntax is a little bit complex product.qty = product.qty + 1 } }) } else { this.state.productsToPurchase.push({itemId: itemId, qty: 1}) } } render() { return ( <CartContext.Provider value={{...this.state, addProduct: this.addProduct}}> {this.props.children} </CartContext.Provider> ) } } export default CartContextProvider;
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Está actualizando el estado directamente, pero debe usar this.setState para actualizarlo,
Demo en vivo
addProduct = (itemId) => { this.setState((oldState) => { const objWithIdExist = oldState.productsToPurchase.find((o) => o.itemId === itemId); return { productsToPurchase: !objWithIdExist ? [...oldState.productsToPurchase, { itemId, qty: 1 }] : oldState.productsToPurchase.map((o) => o.itemId !== itemId ? o : { ...o, qty: o.qty + 1 } ) }; }); };
·
Juan Pablo Isaza
Denunciar
Responde la pregunta