Question

我正在尝试在基本的React应用中获取经/纬度值，并且尝试了以下方法：

1）使用了navigator.geolocation.getCurrentPosition（）react模块，但显示了空值。这是代码：

class DetailsScreen extends React.Component {
constructor(props) {
super(props);

this.state = {
  latitude: null,
  longitude: null,
  error: null,
};
}

   componentDidMount() {
    navigator.geolocation.getCurrentPosition(
      ({coords}) => {
        const {latitude, longitude} = coords
        this.setState({
          position: {
            latitude,
            longitude,
          },
          region: {
            latitude,
            longitude,
            latitudeDelta: 0.001,
            longitudeDelta: 0.001,
          }
        })
      },
      (error) => alert(JSON.stringify(error)),
      // 'enableHighAccuracy' sometimes causes problems
      // If it does, just remove it.
      {enableHighAccuracy: false} 
    );

}
    render(){
        return(
        <View style = {styles.container}>
            <Text style = {styles.boldText}>
               Latitude:
            </Text>

            <Text>
               {this.state.latitude}
            </Text>

            <Text style = {styles.boldText}>
               Longitude:
            </Text>

            <Text>
               {this.state.longitude}
            </Text>
         </View>
        )
    }

}

2）使用react-native-geolocation服务获取纬度/经度值，但再次显示了空值。这是代码段：

class DetailsScreen extends React.Component {
constructor(props) {
super(props);
this.state = { latitude: null,
                longitude: null,
                error: null,
};

  }


componentDidMount() {
    Geolocation.getCurrentPosition(
      (position) => {
        this.setState({
          latitude: position.coords.latitude,
          longitude: position.coords.longitude,
          error: null,
        });
      },
      (error) => this.setState({ error: error.message }),
      { enableHighAccuracy: false, timeout: 30000, maximumAge: 10000 },

    );


}
render(){
        return(
        <View style = {styles.container}>
            <Text style = {styles.boldText}>
               Latitude:
            </Text>

            <Text>
               {this.state.latitude}
            </Text>

            <Text style = {styles.boldText}>
               Longitude:
            </Text>

            <Text>
               {this.state.longitude}
            </Text>
         </View>
        )
    }

}

3）仍未获取使用过的navigator.geolocation.watchCurrentPosition（）的经纬度值。

我确实继续添加

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

在android模块的manifest.xml文件中。因此，我是否还要对android进行特定的权限/更改，以便获取lat / long值？请帮忙。

Answer 1

将其恢复为基本状态，即可使用：

       navigator.geolocation.getCurrentPosition (
            (position) => {
                console.log("location_service", position);
            },
            (error) => { 
                console.log(error) 
            },
            {enableHighAccuracy: false}  
        )

Android清单

    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

然后重建您的应用程序（不只是使用React Native的Dev Menu中的reload）重新运行react-native run-android

要添加一些内容-如果遇到错误或仍然无法返回，请确保您拥有“新的”位置（因此，只需将手机移至新的GPS信号进入的位置即可）

用于运行React Native地理位置应用的Android配置

1 个答案: