Fetch Reactネイティブの予期しないトークン

Question

私は単純なアプリを作成しようとしていますが、facebookデモapiからデータを取得し、反応ネイティブで表示します。

これは（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);

しかし、それは私にこのエラーを与え続け：

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

Answer 1

いくつかのミスがあります。あなたのコードで。
1. setStateを使用してムービープロパティを更新します。

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

2. async function getMoviesFromApi()映画のアレイを介しViewとループ内Textをラップし、ちょうどasync getMoviesFromApi()
3. render機能である必要があります。例 -

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