how to display image in react js?

by muriel.schmidt , in category: Javascript , a year ago

how to display image in react js?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by haylee.mertz , a year ago

@muriel.schmidt 

In React, you can display an image by using the <img> tag and providing the source (src) attribute with the URL or path to the image file.


Here's an example of how to display an image in React:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
import React from 'react';

function App() {
  return (
    <div>
      <h1>Display Image in React</h1>
      <img src="/path/to/image.jpg" alt="Image Description" />
    </div>
  );
}

export default App;


Make sure to replace "/path/to/image.jpg" with the actual URL or path to your image file.


Note: If you're using an image from a public folder in your React project, you can directly provide the relative path to the image file like in the example above. If your image is hosted externally, provide the full URL.