I get the catch error or type error on

```
{films.map((film, i) => { ...

```

> 
> can not read proper 'map' or undefined from the Rest Api swapi in React.
> 
> 
> 

1. build id url to show information
2. Create the component
3. State to add api data
4. Binding the function fetchData to this state
5. Call to api function characters
6. Call to api function movies
7. Life circle to call the function
8. Rendering the component
9. Bring the data of the character to the data to show them
10. mapping the list

```
const api_url_films = 'https://swapi.dev/api/films/'

class Card extends Component {
  constructor(props) {
    super(props)
    this.state = { 
      films: []
    }
    this.fetchDataFilms = this.fetchDataFilms.bind(this) 
  }

  fetchDataFilms(){ 
    fetch(api_url_films)
      .then(data => (data.json()))
      .then(results => {
        const api_data = results
        this.setState({
          films: api_data
        })
      })
  }

  componentDidMount() { 
    this.fetchDataFilms()
  }

  render() { 
    const {films} = this.state

    return(
      <div>
        {films.map((film, i) => {
          return (  
            <li key={i}>{film}</li>
          )
        }
        )}
      </div>
    )
  }
}

```

I try to add in a unordered list also but doesn't work
thanks