soy nuevo en React JS y encontré un problema al actualizar mi objeto usando setState
const [quantity, setQuantity] = useState(0); const [product, setProduct] = useState<Product>(products[0]); const [transactionDetail, setTransactionDetail] = useState<TransactionDetails>({ product, id: 0, price: 0, quantity: 0, }) const addProduct = () => { let price = (product.price * quantity); setTransactionDetail({...transactionDetail,quantity: quantity, product:product, price: price }); console.log(transactionDetail); };debo llamar a la función addProduct dos veces para actualizar el objeto, he leído algunas respuestas, pero todavía no entiendo cómo usar useEffect y las devoluciones de llamada, ¿alguien puede ayudarme?
// use ganchos de useEffect para observar automáticamente el cambio y restablecerlo al nuevo estado actualizado
const [quantity, setQuantity] = useState(0); const [product, setProduct] = useState<Product>(products[0]); const [transactionDetail, setTransactionDetail] = useState<TransactionDetails>({ product, id: 0, price: 0, quantity: 0, }) const addProduct = () => { let price = (product.price * quantity); setTransactionDetail({...transactionDetail,quantity: quantity, product:product, price: price }); console.log(transactionDetail); }; useEffect(() => {setTransactionDetail(transactionDetail)}, [transactionDetail])