0

大家好，看到这个问题的每个人我都需要帮助，并充满希望有人会帮助我试图获得用户的确切位置，以便最终在其他一些功能中传递它。我正在使用 Expo init 和 expo-location

在使用 (reversegeocodeAsync({})) 进行第一次渲染时，它给了我正确的位置，但是在测试它崩溃并给出错误甚至工作时，它并没有像设置状态后那样使数据在全局范围内无法使用

我尝试了不同的方法首先：使用同一页面内的所有功能，但它不起作用

import React, {useState, useEffect, useMemo} from 'react';
import {View, Text, StyleSheet, FlatList } from 'react-native';
import { NavigationEvents } from 'react-navigation';
import TimeApi from '../compnents/TimeApi';
import * as Location from 'expo-location';


const LocationScren = () => {
  const [time, setsTime] = useState({});
  const [errorMsg, setErrorMsg] = useState('');
  const [location, setLocation ] = useState(null);
  const [city, setCity ] = useState();

    const getLocation = async () => {
        let {status} = await Location.requestPermissionsAsync();
        if (status !== 'granted') {
            setErrorMsg('Access to Location denied');
        }

        const location = await Location.getCurrentPositionAsync({});
        setLocation(location)
    }

    const getCity = async () => {
        const place = await Location.reverseGeocodeAsync({
            latitude : location.coords.latitude,
            longitude : location.coords.longitude
        });

        place.find( p => {setCity(p.city);
        })
    }


    const getTime = async () => {
        const response = await TimeApi.get(`/${city}.json`);
        setTime(response.data);
}

    useEffect(() => {
    getTime(), getLocation(), getCity();
    } , []);


    console.log(time);
    console.log(location);
    console.log(city);

    return (
        <View>
        <FlatList 
        data = {time.items}
        keyExtractor = {time => time.first}
        renderItem = {({item}) => {
            return (
                <View>
                    <Text>  {item.first} </Text>
                    <Text>  {item.secnd} </Text>
                    <Text>  {item.third} </Text>
                    <Text>  {item.fourth} </Text>
                    <Text>   {item.fifth} </Text>
                    <Text>  {item.sixth} </Text>
                </View>
            );
        }}
        />
        {errorMsg ? <Text> {errorMsg} </Text> : null }
        </View>
    );
}

const styles = StyleSheet.create({});
export default LocationScren;

在第一次渲染中它给出错误，然后工作，然后给出错误（ null 不是对象（评估'location.coords'）]）

然后我创建了一个上下文文件并添加了我的函数，但仍然得到完全相同的错误

import createDataContext from './createDataContext';
import * as Location from 'expo-location';

const mwaqeetReducer = (state,action) => {
    switch(action.type) {
        case 'get_location' : 
            return action.payload;
        case 'add_error' : 
            return {...state, errorMessage : action.error};
        case 'get_city' : 
            return { cityName : action.payload};
        default:
            return state;
    }
}

const getLocation = dispatch => async () => {
    let {status} = await Location.requestPermissionsAsync();
    if (status === !'granted') {
        dispatch({type: 'add_error' , error : 'Permission to access location denied'});
    }

    let location = await Location.getCurrentPositionAsync({});
    dispatch({type : 'get_location' , payload : location});
    console.log(location);    
}

const getCity = dispatch => async () => {
    let keys = {
        latitude : location.coords.latitude,
        longitude : location.coords.longitude
    }
    const place = await Location.reverseGeocodeAsync(keys);
        place.find( p => p.city);
    dispatch({type : 'get_city' , payload : place});
    console.log(place);
}

export const {Provider, Context} = createDataContext(
    mwaqeetReducer, {
         getLocation, getCity
    } , {
        errorMessage : '', location : {}, cityName : ''
    }
)

所以，我需要帮助来克服这个问题。

4

1 回答 1

1

你可以尝试这样的事情。

  useEffect(() => {
    runFunction();
  } , []);

const runFunction = async () => {
        let {status} = await Location.requestPermissionsAsync();
        if (status !== 'granted') {
            setErrorMsg('Access to Location denied');
        }

        const location = await Location.getCurrentPositionAsync({});
        setLocation(location)

        const place = await Location.reverseGeocodeAsync({
            latitude : location.coords.latitude,
            longitude : location.coords.longitude
        });

        let city;
        place.find( p => {
          city = p.city
          setCity(p.city)
        });

        const response = await TimeApi.get(`/${city}.json`);
        setTime(response.data);

    }
于 2020-04-11T21:38:58.083 回答