Fetch React Native unexpected token

Question

I'm trying to create a simple app the retrieves data from a facebook demo api and displays them with react native.

This is my code (for index.android.js) :

import React, { Component } from 'react';
import { AppRegistry, Text , View } from 'react-native';

class AwesomeProject extends Component{


  constructor(props){
    super(props);
    this.state = {
      movies: []
    }

  };

  componentWillMount(){
      this.getMoviesFromApi().then((res) => {
          movies: res.movies;
      });
  }



   async function getMoviesFromApi() {
    try {
      let response = await fetch('https://facebook.github.io/react-native/movies.json');
      let responseJson = await response.json();
      return responseJson.movies;
    } catch(error) {
      console.error(error);
    }
  }



  render() {

      return(
          <Text>
            {this.state.movies}
          </Text>
        );

  }

}
AppRegistry.registerComponent('AwesomeProject',() => AwesomeProject);

But it keeps giving me this error:

Unexcepted token, excpected ( (28:18) index.android.js:23:18

vinayr · Accepted Answer · 2016-11-16 10:48:01Z

1

There are a few mistakes in your code.
1. Use setState to update movies property.

  this.getMoviesFromApi().then((res) => {
    this.setState({
      movies: res
    });
  });

2. async function getMoviesFromApi() should be just async getMoviesFromApi()
3. In render function, wrap Text inside View and loop through movies array. Example -

  return(
    <View>
      {this.state.movies.map(m => (
        <Text key={m.title}> {m.title} </Text>))}
    </View>
  );

edited Nov 16, 2016 at 10:48

answered Nov 13, 2016 at 13:51

vinayr

11.3k3 gold badges49 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

leartengineer Over a year ago

thank you sir. Can you please tell me where to find some good tutorials to get started with react native? I'm really interested in the technology, but I'm a total beginner with react @vinayr

vinayr Over a year ago

This tutorial is pretty good raywenderlich.com/126063/react-native-tutorial

Collectives™ on Stack Overflow

Fetch React Native unexpected token

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related