如何在实时更新中使用(React Antial,GeOlocation)获得纬度和经度



在这种情况下我是新手,希望有人可以帮助我

我在真实的纬度和经度方面有问题 时间,当我移动到某个地方时,LAT和Long的结果仍然处于相同状态。

我向您展示了我已经制作的代码。

          constructor(props) {
        super(props);
        this.state = {
          latitude: null,
          longitude: null,
          error: null,
          lastPosition: null
        };
      }

    componentDidMount() {
        navigator.geolocation.getCurrentPosition(
          (position) => {
            this.setState({
              latitude: position.coords.latitude,
              longitude: position.coords.longitude,
              error: null,
            });
          },
          (error) => this.setState({ error: error.message }),
          { enableHighAccuracy: false, timeout: 20000,  maximumAge: 1000 },

        );
        this.watchID = navigator.geolocation.watchPosition((position) => {
          const lastPosition = JSON.stringify(position);
          this.setState({ lastPosition });
       });
      }
  componentWillUnmount() {
    window.navigator.geolocation.clearWatch(this.watchId)
  }
  render() {
    return (
      <View style={styles.container}>
          <Text>Latitude: {this.state.latitude}</Text>
          <Text>Longitude: {this.state.longitude}</Text>
          <Text>lastPosition: {this.state.lastPosition}</Text>
          {this.state.error ? <Text>Error: {this.state.error}</Text> : null}
      </View>
    );
  }

watchposition()

的真实用法

https://facebook.github.io/react-native/docs/geolocation#watchposition

在默认方法中,distanceFilter设置为100米。它可以设置为1米,以便您可以捕获任何更改的位置。

尝试这个

this.watchID = navigator.geolocation.watchPosition((lastPosition) => {
        const lastPosition = JSON.stringify(position);
        console.log(lastPosition);
        this.setState({ lastPosition });
    }
},
(error) => console.log(error)),
{enableHighAccuracy: true, timeout: 10000, maximumAge: 0, distanceFilter: 1});

相关内容

  • 没有找到相关文章

最新更新