Cuando vuelvo a cargar la página, la cantidad se actualiza, pero hasta que la página vuelve a cargar, la cantidad no se actualiza en la interfaz de usuario. Por otro lado, mi base de datos disminuye la cantidad.

 const StockUpdate = () => { const { id } = useParams(); const [stockUpdate, setStockUpdate] = useState({}); useEffect(() => { const getItemById = async () => { const url = `http://localhost:8000/inventory/${id}` const { data } = await axios.get(url); setStockUpdate(data); } getItemById(); }, [id]); const handleDeliveryButton = () => { console.log(stockUpdate) const item = stockUpdate; const url = `http://localhost:8000/inventory/${id}`; fetch(url, { method: 'PUT', headers: { 'Content-type': 'application/json', }, body: JSON.stringify(item), }) .then(res => res.json()) .then(data => { console.log(data) }); toast('Stock quantity updated after delivery !!!!'); };