Tengo un botón con Text Click View Price . Estoy mostrando la Amount cuando se hace clic en el botón.
Quiero cambiar el valor del botón a priceVar = "Reset Price"; cosa que no está pasando en mi caso. Puedo establecer el valor en 0.
¿Cómo puedo configurar el texto del botón para Reset Price nuevamente?
const [price, setPrice] = useState(0); let priceVar = "Click View Price"; const viewPrice = () => { if (price === 0) { setPrice(Math.floor(Math.random() * 100)); } else { priceVar = "Reset Price"; --------------------> NOT WORKING setPrice(0); } }; return ( <article className="book" onMouseOver={() => { console.log(title); }} > <div> <button type="button" onClick={viewPrice()}> {priceVar} </button> <h3>${price}</h3> </div> </article> );Puede crear un useState hook para el texto del botón como se muestra a continuación
const [priceVar, setpriceVar] = useState("Click View Price"); const viewPrice = () => { if (price === 0) { setpriceVar("Click View Price"); setPrice(Math.floor(Math.random() * 100)); } else { setpriceVar("Reset Price"); setPrice(0); } };¡Tu variable no es React State!
import { useState } from "react"; let priceVar = "..."; // Try useState like with your price variable: const [priceVarNew, setPriceVarNew] = useState("Click View Price") // Then reference that state like your price with: {priceVar}, or change it accordingly with setState("Reset Price")También puedes hacer ternario para este también.
setPrecio(precio === 0 ? Math.floor(Math.random() * 100) : 0);