内联动态更改背景图片 React

Question

I'm trying to learn React using movieDB. Each time a user searches a movie the background image should update. However, it states I have an unexpected token. What am I missing here?

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>
    );
}

}

Answer 1

var imgUrl inside the object definition...

And yeah the whole block should go inside the render method

Answer 2

I figured it out. A community to help not criticize...

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