反応しないネイティブ構文エラー予期せぬトークンフェッチapi

Question

私はExpoとWindowsで反応ネイティブを使用しています。 私はネイティブリアクトで私はこのエラーを持って、WebサービスAPIからデータを取得したい：App.js：予期しないトークン（15：6） 私はここでWebサービスから

を応答配列を取得したいが、私のコードです：

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

export default class App extends Component { 



fetch('https://httpbin.org/get').then(function (response) { 
     return response; 
     }).then(function (response) { 
     setTimeout(function() { 
      main.setState({ 
      infoStatus: 'loaded' 
      }); 
     }, 300); 
     return response.json(); 
     }).then(function (data) {alert(data); 
     main.setState({ 
      city: data.name, 
      country: data.sys.country, 
      temperature: data.main.temp, 
      humidity: data.main.humidity, 
      wind: data.wind.speed 
     }); 
     }).catch(function() { 
     main.setState({ 
      infoStatus: 'error' 
     }); 
     }); 

    render() { 
    return (
     <View style={styles.container}> 
     <Text style={styles.welcome}> 
      Welcome 
     </Text> 
     </View> 
    ) 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: 'center', 
    margin: 10, 
    }, 
}) 

Answer 1

あなたのコードをcomponentDidMountライフサイクルフックに入れたい場合があります。

class App extends Component { 
    componentDidMount() { 
    fetch() ... 
    } 

    render() { 
    } 
} 

Answer 2

コード内のオブジェクト「main」とは何ですか？ なぜsetTimeoutを使用しますか？

あなたは通常、あなたが例えばcomponentWillMount でそれを行います ...メソッドの内部で呼び出すフェッチ配置する必要があります。

export default class App extends Component { 
    componentWillMount() { 
    fetch('https://httpbin.org/get') 
    .then(function(response) { 
     this.setState({ infoStatus: 'loaded' }); 
     return response.json(); 
    }) 
    .then(function(data) { 
     this.setState({ 
     city: data.name, 
     country: data.sys.country, 
     temperature: data.main.temp, 
     humidity: data.main.humidity, 
     wind: data.wind.speed 
     }); 
    }) 
    .catch(function() { 
     main.setState({ 
     infoStatus: 'error' 
     }); 
    }); 
    } 
    render() {...} 
}