0

我试图在我的基本反应应用程序中获取纬度/经度值，我尝试了以下方法：

1)使用了 navigator.geolocation.getCurrentPosition() 反应模块，但显示空值。这是代码：

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() 仍然没有获取 lat/long 值。

我确实继续添加

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

在 android 模块的 manifest.xml 文件中。那么我想还有更多的 android 特定权限/更改以便获取 lat/long 值吗？请帮助。

4

1 回答 1

0

回到基础，这应该有效：

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

安卓清单

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

然后重建您的应用程序（不要只使用 React Native 的开发菜单中的重新加载）重新运行react-native run-android

一些需要补充的东西——如果你遇到错误，或者它仍然没有返回，请确保你有一个“新”的位置（所以只需将你的手机移动到有新 GPS 信号的地方）

于 2018-09-26T10:39:58.853 回答