2017-03-08 3 views
-1

movieDB를 사용하여 React를 배우려고합니다. 사용자가 영화를 검색 할 때마다 배경 이미지가 업데이트되어야합니다. 그러나 예기치 않은 토큰이 있음을 나타냅니다. 내가 여기서 무엇을 놓치고 있니?인라인 동적으로 배경 이미지를 변경합니다. React

class Movie extends Component { 

var styles = { 
    var imgURL = 'https://image.tmdb.org/t/p/' + this.props.movie.poster_path; 
    backgroundImage: 'url(' + imgUrl + ')', 
    backgroundPosition: "center", 
    backgroundSize: "cover" 
} 

render() { 
    return (
     <div className="Movie" style={styles}> 
      <div> 
       <img src={'https://image.tmdb.org/t/p/w500/' + this.props.movie.poster_path} /> 
      </div> 
      <strong>{this.props.movie.tagline}</strong> 
      <h3>{this.props.movie.title}</h3> 
      <p>{this.props.movie.overview}</p> 
     </div> 
    ); 
} 

} 객체 정의 내부

+0

이 경우에는 린터 에스 트리 터를 사용하는 것이 좋습니다. – webdeb

답변

0

var imgUrl ...

그리고 그래, 전체 블록은 내가 그것을 알아 냈 렌더링 방법

0

내부에 가야한다. 비평하지 않는 데 도움이되는 커뮤니티 ...

var styles = { 
     backgroundImage: `url(https://image.tmdb.org/t/p/w500/${this.props.movie.poster_path})`, 
     backgroundPosition: "center", 
     backgroundSize: "cover" 
    } 
관련 문제