const ProductEdit = () => { const[user]=useAuthState(auth); const {inventoryId}=useParams(); const [product,SetProduct]=useState({}); useEffect(()=>{ const url=`http://localhost:5000/product/${inventoryId}`; fetch(url) .then(res=>res.json()) .then(data=>SetProduct(data)); },[]) return ( <div className='mt-5 '> <h3 className='text-center'> Product Detail of {product.name}</h3> <form className='w-50 mx-auto'> <input className='w-100 mb-2' type="text" placeholder='Name' name='name' value={product.name} required/> <br /> <input className='w-100 mb-2' type="text" placeholder='Price' name='quantity' value={product.price} required/> <br /> <input className='w-100 mb-2' type="text" placeholder='Quantity' name='number' value={product.quantity} required/> <br /> <input onclick={handleReduce} type="submit" value="Delivered" /> </form>Quiero reducir la cantidad de datos que se cargan también en MongoDB. ¿qué debería hacer?
Veo lo que estás tratando de hacer.
Puedes hacer esto de un par de maneras.
El primer método es que reduce la cantidad desde el lado del servidor simplemente enviando -1 en el cuerpo.
El segundo método consiste en hacer el cálculo desde el lado del cliente y enviar la cantidad actualizada al lado del servidor.
En cualquier caso, puedes hacer esto con una función.
Veo que está llamando a una función en el evento onClick .
Entonces, ¿por qué no usar eso?
Todo lo que tiene que hacer es envolver esa función onClick como una función de devolución de llamada. Así como esto:
<input onclick={()=>handleReduce(-1)} type="submit" value="Delivered" /> ¿Ver? Solo paso -1 como parámetro de función.
Y puedes declarar la función así:
const handleQuantity = (number) => { axios.patch( `http://localhost:5000/items/${id}`, { quantity: item.quantity + number, }, { headers: { Authorization: `Bearer ${localStorage.getItem("token")}`, }, } ); const newItem = { ...item, quantity: item.quantity + number }; setItem(newItem); };