Revisé otras preguntas con el error pero no tuve suerte. Estoy creando una pantalla de orden de edición. Obtengo los datos del pedido del estado y los asigno a tableData. Y cuando uso tableData para agregar el contenido a una tabla, aparece el error "Error de tipo: no se pueden leer las propiedades de undefined (leyendo 'mapa')"

 const PurchaseOrderEditScreen = ({history}) => { const dispatch = useDispatch() const { id } = useParams() const orderId = id const orderDetails = useSelector( state => state.orderDetails ) const { loading, error, order } = orderDetails const [tableData, setTableData] = useState([]) useEffect(() => { if(!userInfo){ history.push('/login') } if(!order || order._id !== orderId ){ dispatch(getOrderDetails(orderId)) } },[dispatch, history, userInfo, orderId, order]) return( <> {loading ? <Loader /> : error ? <Message variant='danger'>{error}</Message> : ( <div> <Table striped bordered hover responsive='md' className='table-sm mt-3' id="table-to-xls"> <thead> <tr> ----- </tr> </thead> <tbody> {tableData.orderItems.map(item => ( <tr key={item._id} > ------ </tr> ))} </tbody> </Table>

Si trato de agregar contenido a la tabla desde un pedido como order.orderItems.map (elemento que funciona pero no con tableData.orderItems.map . Pude ver en console.log de tableData al principio como vacío.

Mientras escribo código con order.orderItems.map, funciona, luego, cuando cambio a tableData.orderItems.map, funciona bien sin ningún error. Pude ver cuándo ocurre el renderizado automático después de que el código cambie el tableData en console.log tiene datos. Pero al mismo tiempo, cuando actualiza la página, arroja el error.

También agregué el siguiente código, pero sigo teniendo el mismo problema.

 useEffect(()=>{ setTableData(order) },[order])

¿Puede alguien ayudarme con esto y decirme por qué en la consola inicial. Los datos de la tabla de registro se muestran vacíos. Por favor, hágamelo saber si necesita más detalles.