по какой-то причине мое изображение из штата не отображается на моей веб-странице в ReactJS.
Я пытался использовать movie.poster_src, но все равно получаю сообщение об ошибке. Также были поиски, как вытащить изображения из состояния для рендеринга на странице
import React, { Component } from 'react';
import './App.css';
import {Button} from "react-bootstrap"
class App extends Component {
constructor(props) {
super(props);
console.log("This is my initializer");
const movies = [
{ id: 0, poster_src="https://www.sideshowtoy.com/wp-content/uploads/2018/08/dc-comics-batman-statue-sideshow-prime1-studio-feature-2005181-2.jpg", title:"Avengers", overview: "dfnkjsnknsdfnjksdnfjkdsnfkjnsdf"},
{ id: 1, poster_src="https://www.sideshowtoy.com/wp-content/uploads/2018/08/dc-comics-batman-statue-sideshow-prime1-studio-feature-2005181-2.jpg", title:"Supermsan", overview: "knsjkdsnkjfnjkdsnfkjsndfj"},
{ id: 2, poster_src="https://www.sideshowtoy.com/wp-content/uploads/2018/08/dc-comics-batman-statue-sideshow-prime1-studio-feature-2005181-2.jpg"}
];
this.state = {
rows: [
<p key="0">This is my row0</p>,
<p key="1">This is my row1</p>,
<p key="2">This is my row2</p>
]}
const movieRows = [];
movies.forEach((movie)=> {
console.log(movie.id);
const movieRow =
<table key={movie.id}>
<tbody>
<tr>
<td>
<img src={movie.poster_src} alt="image"/>
</td>
<td>
{movie.title}
</td>
</tr>
</tbody>
</table>
movieRows.push(movieRow);
})
console.log("hsbds",movieRows)
this.state = {
rows: movieRows
}
}
handleSearch =(e)=> {
e.preventDefault();
const searchTerm= e.target.elements.input.value;
console.log(searchTerm);
}
render() {
return (
<div className="App">
<table className="tableStyle">
<tbody>
<tr>
<td>
<img alt="app icon" className="moviesLogo" src="http://pluspng.com/img-png/movie-png-hd-http-www-indigital-co-in-upload-channellogo-1696.png"/>
</td>
<td width={8}/>
<td className="logoText">
<h2>MoviesNow Search</h2>
</td>
</tr>
</tbody>
</table>
<form className="formStyle" onSubmit={this.handleSearch}>
<input name="input" className="inputStyle" placeholder="Enter movie title" />
<Button type="submit" bsStyle="warning" className="searchButtonStyle">Search</Button>
</form>
{this.state.rows}
</div>
);
}
}
export default App;
Я хочу, чтобы изображение отображалось. Но я получил ошибку:
. / SRC / App.js
Строка 12: ошибка синтаксического анализа: неожиданный токен
10 |
11 | конст фильмы = [
12 | {id: 0, poster_src = "https://www.sideshowtoy.com/wp-content/uploads/2018/08/dc-comics-batman-statue-sideshow-prime1-studio-feature-2005181-2.jpg", title:" Мстители ", обзор:" dfnkjsnknsdfnjksdnfjkdsnfkjnsdf "},
| ^
13 | {id: 1, poster_src = "https://www.sideshowtoy.com/wp-content/uploads/2018/08/dc-comics-batman-statue-sideshow-prime1-studio-feature-2005181-2.jpg", title:" Supermsan ", обзор:" knsjkdsnkjfnjkdsnfkjsndfj "},
14 | {id: 2, poster_src = "https://www.sideshowtoy.com/wp-content/uploads/2018/08/dc-comics-batman-statue-sideshow-prime1-studio-feature-2005181-2.jpg"}
15 | ];