Estoy siguiendo un tutorial sobre udemy y me enfrento a un problema crítico, lo que me impide seguir codificando...
No hay typeo... He copiado el código fuente. Tengo un problema con la selección del método de pago... Estoy 100% seguro de que se trata de "type=radio". Simplemente no puedo seleccionarlo y, al presionar Continuar, se produce el error anterior.
TypeError: history.push is not a function submitHandler 20 | const submitHandler = (e) => { 21 | e.preventDefault() 22 | dispatch(savePaymentMethod(paymentMethod)) > 23 | history.push('/placeorder') | ^ 24 | } 25 | 26 | return ( function PaymentScreen(history) { const cart = useSelector(state => state.cart) const { shippingAddress } = cart const dispatch = useDispatch() const [paymentMethod,setPaymentMethod] = useState('paypal') if(!shippingAddress.address ) { history.push('shipping') } const submitHandler = (e) => { e.preventDefault() dispatch(savePaymentMethod(paymentMethod)) history.push('/placeorder') } return ( <FormContainer> <CheckoutSteps step1 step2 step3 /> <Form onSubmit={submitHandler}> <Form.Group> <Form.Label as='legend'>Select Method</Form.Label> <Col> <Form.Check type='radio' label='PayPal or Credit Card' id='PayPal' name='paymentMethod' checked onChange={(e) => setPaymentMethod(e.target.value)} > </Form.Check> </Col> </Form.Group> <Button type='submit' variant='primary'> Continue </Button> </Form> </FormContainer> ) }No tengo problemas con la redirección (Historial) tengo problemas con la selección de la opción de pago "tipo = radio" entiendo la bruja 'tipo = verificar' y no puedo hacer 'marcar' allí, da un pequeño campo de texto cuadrado. Estoy usando un enrutador antiguo porque era la única forma de completar el tutorial... Estoy usando el mismo método de historial para otros pasos de mi pago y todo funciona... y como no puedo seleccionar el método de pago, luego no puedo hacerlo pago debido a que falta el diccionario yendo al backend ...
Debe importar el enlace useHistory de react-router-dom: https://v5.reactrouter.com/web/api/Hooks
Ejemplo:
import { useHistory } from "react-router-dom"; function HomeButton() { let history = useHistory(); function handleClick() { history.push("/home"); } return ( <button type="button" onClick={handleClick}> Go home </button> ); }Esto se debe a que está utilizando la versión anterior del dom del enrutador de reacción en la versión anterior para paginar el
history.push("/abc")en la nueva versión de react router dom usamos esto
import React from "react"; import { useNavigate } from "react-router-dom"; const Exp = () => { const navigate = useNavigate(); const ChangePage = () => { navigate("/placeorder"); }; return <button onClick={ChangePage}>Change</button>; };exportar por defecto Exp;
para más información visite el sitio