0

estoy realizando un interfaz de carrito de compras, tengo un useState que esta conformado por un array de objetos (son los elementos del carrito). Cuando quiero aumentar la cantidad de un producto, lo busco en el array con el metodo Find() y le aumento la propiedad Quanty en uno, directamente. Esto si bien me muta el estado no se renderiza automaticamente en los elementos html del componente, entiendo que está mutado pero no encuentro una manera de cambiarlo de otra forma. He intentado hacer una referencia, modificarla con el metodo find y usar el setState para actualizar el array pero igual no funciona. Les dejo mi codigo.

Esta para dismuir la cantidad de unidades del producto

    function decrease(name) {
        let product = myCarListItems.find(item => item.name === name);
        if(product.quanty > 1){product.quanty=product.quanty-1};
        console.log(product)
    }

Aquí en la funcion aumentar intenté hacerlo por referencia pero no funcionó

    function increase(name) {
        let ref = myCarListItems;
        let product = ref.find(item => item.name === name)
        product.quanty=product.quanty+1;      
        setCarListItems(ref)

    }

Y este es mi objeto dentro del estado

{name:product.commonName,price:product.price,quanty:1}

1 respuesta 1

0

El asunto con React, y arreglos, es que react trata de buscar que haya cambiado algo en la variable, pero tu arreglo generalmente es el mismo, lo que se suele usar en React es el spread operator (...), declarando un arreglo nuevo dentro de tu set, por ejemplo

const [arreglo, setArreglo] = useState([1, 2])
arreglo.push(3)
setArreglo([...arreglo])

De esta forma, declaramos un arreglo nuevo, y metemos lo que tenemos dentro de ese arreglo nuevo, podrías intentar usando el spread operator

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.