Реактивная загрузка приложений fetchAPI? - PullRequest
0 голосов
/ 03 мая 2018

Я занимаюсь разработкой приложения для погоды, используя API openweathermap, я успешно все реализовал, теперь я хочу использовать Apploading с выставки чтобы получить результаты от API, поэтому, когда открывается главный экран, все данные извлекаются и отображаются на экране вместо ожидания ответа от API,

weatherAPI.js:

    const rootUrl = 'http://api.openweathermap.org/data/2.5/weather?appid=API_KEY'
    export const fetchWeather = (lat,lon) => {
    const url = rootUrl+'&lat='+lat+"&lon="+lon+"&units=metric"
    console.log(url)

    return fetch(url)
        .then(res => res.json())
        .then(json => ({
            temp: json.main.temp,
            pressure: json.main.pressure,
            humidity: json.main.humidity,
            maxTemp: json.main.temp_max,
            minTemp: json.main.temp_min,
            weather: json.weather[0].main,
            weatherDescription: json.weather[0].description,
            name: json.name,
            country: json.sys.country,
            windSpeed: json.wind.speed,
            windDeg: json.wind.deg,
            clouds: json.clouds.all,
            sunrise: json.sys.sunrise,
            sunset: json.sys.sunset,

        }))
}

Home.js:

componentDidMount(){
 this._getData()
 }
 _getData(){
navigator.geolocation.getCurrentPosition(
            (posData) => fetchWeather(posData.coords.latitude, posData.coords.longitude)
                .then(res => this.setState({
                    temp: Math.round(res.temp),
                    weather: res.weather,
                    weatherDescription: res.weatherDescription,
                    name: res.name,
                    country: res.country,

                })),
                (error)=> alert(error),
                {timeout:10000}
        )  
}

Также и, возможно, это очень простой вопрос:

Я хочу создать значок загрузки, чтобы перезагрузить данные? мой подход к этому решению был touchableOpacity с вызовом onPress this_getData (), но я чувствую, что это неправильное кодирование?

Ответы [ 2 ]

0 голосов
/ 03 мая 2018

Пожалуйста, свяжите _getData с этим или используйте функцию жирной стрелки. Это может решить проблему.

0 голосов
/ 03 мая 2018

Из документации по загрузке приложения Expo https://docs.expo.io/versions/latest/sdk/app-loading, Предназначено для начальной загрузки приложения. Обычно для асинхронного запроса, такого как запрос информации о погоде, обычно есть 3 состояния: прогресс, успех, сбой. Вы должны удостовериться, что отрисовываете соответствующим образом для всех этих состояний. Во время получения вы можете отобразить индикатор активности https://facebook.github.io/react-native/docs/activityindicator.html Либо у вас может быть кнопка «Повторить / Обновить» для извлечения последних данных вручную, либо у вас может быть таймер, который получает последние данные с определенным интервалом

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...