Skip to main content
1 de 3

No pudo acceder al valor _id que da por defecto Mongodb desde React

Tengo un Problema necesito poder utilizar el _id que da por defecto Mongodb para poder obtener una contraseña, Pero lo que pasa es que en el sigueinte codigo en donde ya se obtuvo la informacion del servidor donde esta lista para imprimirse en data.map si me deja ver el id como se puede apreciar lo estoy impirmiendo en pantalla pero cuando quiero pasarlo como un parametro de un objeto que estoy importando simplemente falla se imprimo el texto que puse en CardProductoHome "No hay key papito" que puse como prueba, como le puedo hacer para que obtenerlo y lo pueda importar en esta funcion

import axios from 'axios';
import CardProductoHome from "../Atoms/CardProductoHome";

const ConjuntoCards = ({ url }) => {
const [data, setData] = useState()

    useEffect(() => {
        return axios.get(url)
        .then(  async result => {
            const  resp = await result
            setData(resp.data)
        })
        .catch( err =>{
            let error = err
            console.log(error)
        })
    },[data, url ])

    return(
        <div>
            {
                data ? 
                data.map( (props)=>{
                    const id = props._id
                    console.log(id)
                    return(
                        <CardProductoHome 
                            description={props.description}
                            precio={props.price}
                            title={props.title}
                            key={id}
                        />
                    )
                })
                : 
                null
            }
        </div>
    )
}
export default ConjuntoCards;

Este es el codigo del principal Conjunto de Cards en el console.log de id si se imprime el _id Correctamente

Y en esta funcion que estoy importando el key ya no me funciona

const CardProductoHome = ({
    precio, 
    title, 
    description, 
    key
}) => {

    return (
        <div id = { key }>
        <div>
            {
                <h1>{ key ? key : "No hay Key papito" }</h1>
            }
            <h2>{precio}</h2>
            <h1>{title}</h1>
            <p>{description}</p>
        </div>
        <div>
            <ShowImage img={key}/>
        </div>
    </div>
    )
}
export default CardProductoHome; ```