0
248
VistasNo se puede mostrar una imagen usando React JS
Estoy comenzando con React JS con un código para mostrar una imagen, una etiqueta de encabezado y una lista ordenada. Aquí está el código JS:
import React from 'react' import ReactDOM from "react-dom" const test = ( <div> <img src="./balloons.png" width="100px" alt=""/> <h1>Names</h1> <ol> <li>A</li> <li>B</li> <li>C</li> <li>D</li> </ol> </div> ) ReactDOM.render(test,document.getElementById("root"))Aquí está la parte index.html:
<html> <head> <link rel="stylesheet" href="index.css"> </head> <body> <div id = "root"></div> <script src = "index.pack.js"></script> </body> </html> Ahora, el código se ejecuta y muestra un resultado como este en la aplicación de reacción. No puedo ver la foto que subí. 
Aquí está la disposición de carpetas en VS Code si ayudaría:
¡Gracias por adelantado!
·
Juan Pablo Isaza
3 Respuestas
Responde la pregunta0
Si guarda las imágenes en la carpeta pública , funciona bien
·
Juan Pablo Isaza
Denunciar
0
intente importar la imagen y usarla en src así:
import React from 'react' import ReactDOM from "react-dom" // try to import image import YourImageUrl from './balloons.png'; const test = ( <div> <img src="{YourImageUrl}" width="100px" alt=""/> <h1>Names</h1> <ol> <li>A</li> <li>B</li> <li>C</li> <li>D</li> </ol> </div> ) ReactDOM.render(test,document.getElementById("root"))
·
Juan Pablo Isaza
Denunciar
0
Tendrás que importar la imagen primero. Escribe código js como este
import React from 'react' import ReactDOM from "react-dom" import balloons from './balloons.png' const test = ( <div> <img src={balloons} width="100px" alt=""/> <h1>Names</h1> <ol> <li>A</li> <li>B</li> <li>C</li> <li>D</li> </ol> </div> ) ReactDOM.render(test,document.getElementById("root"))
·
Juan Pablo Isaza
Denunciar
Responde la pregunta