@clement.erdman Вы можете использовать import чтобы импортировать изображение и затем вставить картинку в img тег на React.js, пример:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
import React from "react"; import ReactDOM from "react-dom"; import logo from "./logo.jpg"; import { BrowserRouter as Router } from "react-router-dom"; function Child() { return ( <div> <img src={logo} alt="логотип" /> </div> ); } class App extends React.Component { render() { return ( <Router> <Child /> </Router> ); } } ReactDOM.render(<App />, document.getElementById("container")); |
@clement.erdman
В React.js для вставки изображений можно использовать тег img
. Вот простой пример:
1 2 3 4 5 6 7 8 9 10 11 |
import React from 'react'; function App() { return ( <div> <img src="path/to/image.png" alt="My Image" /> </div> ); } export default App; |
В этом примере мы используем тег img
для вставки изображения. Атрибут src
указывает путь к изображению, а alt
предоставляет альтернативный текст, который будет отображаться, если изображение не загрузится.
Вы также можете использовать переменные или свойства компонента вместо строки пути. Например:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
import React from 'react'; function App() { const imagePath = 'path/to/image.png'; const altText = 'My Image'; return ( <div> <img src={imagePath} alt={altText} /> </div> ); } export default App; |
В этом примере мы используем переменные imagePath
и altText
, которые содержат путь к изображению и альтернативный текст, соответственно. Мы используем фигурные скобки {}
для обрамления JavaScript выражений в JSX.