0

Hola estoy trabajando con Reactjs y tratando de crear una aplicación sencilla. En el método render() de uno de mis componetes estoy usando una etigueta para poner una imagen y esta no se está mostrando en el navegador, en su lugar se muestra el texto alternativo, aquí va el código:

class ProductDetails extends React.Component {
  render() {
    const description = this.props.data.descripcion.map(tip => {
      return <li>{tip}</li>
    });
    return(
    <div className="borde">
      <img src={this.props.data.url} alt="imagen no encontrada" className="imgDetalle"/>      
      <h2 className="borde">{this.props.data.itemTitle}</h2>
      <h3 className="borde">{this.props.data.price}</ h3>
      <ul>Descripción
        {description}
      </ul>
    </div>
    
    );
  }
}


class App extends Component {
  render() {
    let data = ['Autos', 'Motos'];
    const dataDetails = 
      
        {
          imgUrl: 'https://i.imgur.com/E2PbxmA.jpg',
          itemTitle: 'Lavadora LG',
          price: '$ '+ 1000,
          descripcion: ['10 Kg de ropa a lavar', '6.5 Kg para secado', '10 años de Garantía']
        }
        return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">TIENDA</h1>
        </header>
        <MenuLateral itemList={data}/> 
        <ProductDetails data={dataDetails}/>       
      </div>

    );
  }
}

El primero es el componente que se encarga de mostrar la imagen y el segundo se encarga de renderizar al primero con sus atributos via props. El resto de los atributos se muestran correctamente, el único problema es con la imagen. Si pudieran ayudarme. Gracias

1 respuesta 1

0

estas llamando, this.props.data.url, pero no existe url en data, le estas enviando imgUrl

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.