Por favor, alguien que me ayude. Gracias por adelantado.
mientras trabajaba, me quedé atascado en un problema. Mi useEffect
no está siendo llamado. He cambiado de dependencia varias veces, pero en vano.
Aquí está mi código:
import React, { useEffect } from 'react' import { Card, Col, Image, ListGroup, Row } from 'react-bootstrap' import { useDispatch, useSelector } from 'react-redux' import { Link, useParams } from 'react-router-dom' import Loader from '../components/Loader' import Message from '../components/Message' import { getOrderDetails } from '../redux/actions/orderActions' function OrderPage() { const { id } = useParams() const dispatch = useDispatch() const orderDetails = useSelector(state => state.orderDetails) const { order, error, loading } = orderDetails debugger useEffect(() => { if (!order || order._id !== Number(id)) { dispatch(getOrderDetails(id)) } }, [order, dispatch, id, orderDetails]) if (!loading && !error) { order.itemsPrice = order.orderItems.reduce((acc, item) => acc + item.price * item.qty, 0).toFixed(2) }
Aquí, mi useEffect
no se activa primero, sino que va a verificar if
una condición y un error de lanzamiento. Me parece peculiar ya que puse la condición !loading
& !error
. No debería verificar el interior hasta if
reciba order
de redux store
.
Por favor, que alguien me ayude. Gracias de nuevo.
useEffect siempre se ejecutará la primera vez después del primer procesamiento y luego se ejecutará la otra vez si alguna de las dependencias cambia
Por lo tanto, necesitaría tener el siguiente código para useEffect
useEffect(() => { if (!order) { dispatch(getOrderDetails(id)) } else if ( order._id !== Number(id) ) { dispatch(getOrderDetails(id)) } }, [order, dispatch, id, orderDetails])
Esto verificará si el pedido no está allí y luego obtendrá el pedido, o si el pedido está allí pero la identificación del pedido coincide con la identificación que obtenemos de la URL y luego también obtendrá el pedido.