title: How do I fix React ' is not defined no-undef'?
body: <p>I am trying to create a detailed view for each movie in a list of movies. I have Django as backend and React as frontend.</p>
  
  <p>When I am trying to make a detailed view for each movie I get an error.</p>
  
  <p>Error log:</p>
  
  <pre><code>Failed to compile.
  
  ./src/components/movie-list.js
    Line 5:26:  'movie' is not defined  no-undef
    Line 6:28:  'movie' is not defined  no-undef
  
  Search for the keywords to learn more about each error.
  </code></pre>
  
  <p>I have tried to bind but don't fully understand where the problem is.</p>
  
  <p><strong>App.js</strong></p>
  
  <pre><code>import React, { Component } from 'react';
  import MovieList from "./components/movie-list";
  
    componentDidMount() {
      //fetch data
      fetch('http://127.0.0.1:8000/api/movies/', {
        method: 'GET',
        headers: {
          'Authorization': 'Token 8588cb6fcc2ee0bf9915d4c6b720554347d5883f'
        }
      }).then(resp =&gt; resp.json())
        .then(res =&gt; this.setState({ movies: res }))
        .catch(error =&gt; console.log(error))
    }
  
    movieClicked = movie =&gt; {
      console.log(movie);
    }
  
    render() {
      return (
        &lt;div className="App" &gt;
          &lt;header className="App-header"&gt;
            &lt;h1&gt;Movie Rater&lt;/h1&gt;
              &lt;MovieList movies={this.state.movies} movieClicked={this.movieClicked}/&gt;
              &lt;MovieDetails movie={this.state.selectedMovie}/&gt;
          &lt;/header&gt;
        &lt;/div&gt;
      );
    }
  }
  
  </code></pre>
  
  <p><strong>movie-list.js</strong></p>
  
  <pre><code>import React from 'react';
  
  function MovieList(props) {
  
      const movieClicked = movie = evt =&gt; {
          props.movieClicked(movie);
      }
  
      return (
          &lt;div&gt;
              {props.movies.map(movie =&gt; {
                  return (
                      &lt;h3 key={movie.id} onClick={movieClicked(movie)}&gt;
                          {movie.title}
                      &lt;/h3&gt;
                  )
              })}
          &lt;/div&gt;
      )
  }
  
  export default MovieList;
  </code></pre>
  
  <p>I want to make the detailed view work.</p>