0
240
Vistas¿Cómo pasar el valor de las opciones de selección al botón al hacer clic en reaccionar?
Puedo pasar el valor de mis opciones de selección, pero cambio de opinión y quiero pasar el valor primero en el botón para la función onClick. Gracias.
import { useSelector, useDispatch } from "react-redux"; const Purchase = () => { const products = useSelector(state => state.products); const dispatch = useDispatch(); const purchaseHandler = e => { let pName = e.target.options[e.target.selectedIndex].text; let price = e.target.value; let obj = { pName, price }; dispatch({ type: "PURCHASE", payLoad: obj }); }; return ( <div> <select onChange={e => purchaseHandler(e)}> {products.map((product, index) => { return ( <option value={product.price} key={index}> {product.pName} - ${product.price} </option> ); })} </select> <button onClick={purchaseHandler} className="addToCart"> Add to Cart </button> </div> ); }; export default Purchase;
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Guarde productIndex cuando cambie la selección y obtenga el product de la matriz de products usando el índice al hacer clic en el botón.
Prueba como a continuación
import { useSelector, useDispatch } from "react-redux"; const Purchase = () => { const products = useSelector(state => state.products); const dispatch = useDispatch(); const [productIndex, setProductIndex] = useState(0); const purchaseHandler = () => { dispatch({ type: "PURCHASE", payLoad: products[productIndex] }); }; return ( <div> <select onChange={e => { setProductIndex(e.target.value); }} > {products.map((product, index) => { return ( <option value={index} key={index}> {product.pName} - ${product.price} </option> ); })} </select> <button onClick={purchaseHandler} className="addToCart"> Add to Cart </button> </div> ); }; export default Purchase; 
·
Juan Pablo Isaza
Denunciar
Responde la pregunta