如何按原因地图中的按钮打印纬度？

Question

我使用DefaultMarkers从用户获取位置。

我有一个按钮和一个功能。在函数中，我使用代码在控制台中显示纬度。现在当我按下按钮时，在控制台中没有发生但是第二次按下我可以在控制台中看到纬度。

如果我改变位置并再试一次，我应按两次按钮以在控制台中查看纬度。

  constructor(props){
    super(props);
    this.state={
      markers: [],
    }
  }

  onMapPress(e) {
      this.setState({
        markers: [
          {
            coordinate: e.nativeEvent.coordinate,
            key: 0,
          },
        ],
      });
    }

 SaveAddress=()=>{
  console.log(JSON.stringify(this.state.markers[0].coordinate.latitude);
 }


  <Button onPress={this.SaveAddress}>
     <Text>Save</Text>
  </Button>


 <MapView
              style={styles.map}
              initialRegion={{
                latitude: 28.95761453,
                longitude: 50.83710976,
                latitudeDelta: 0.0040,
                longitudeDelta: 0.0040,
              }}
                provider={this.props.provider}
                onPress={(e) => this.onMapPress(e)}
              >
              {this.state.markers.map(marker => (
                <Marker
                  key={marker.key}
                  coordinate={marker.coordinate}
                />
              ))}

 </MapView>

Answer 1

因为，当你第一次按下那个按钮来执行这个功能

SaveAddress=()=>{console.log(JSON.stringify(this.state.markers[0].coordinate.latitude);}

国家是空的，所以你没有得到任何价值。在第一次按下时，它只是开始保存状态并开始渲染。但是在你第二次按下时，渲染就完成了，状态就变好了，然后你就得到了价值。你可以做

import React, { Component } from 'react';
import { View, Text, TouchableOpacity, WebView, StyleSheet,KeyboardAvoidingView, ActivityIndicator,Platform,TextInput,Dimensions} from 'react-native'
import MapView, { PROVIDER_GOOGLE, Region,Marker } from 'react-native-maps';


export default class App extends React.Component {
   
 constructor(props){
super(props);
this.state={
markers: [
    {
        coordinate: {            latitude: 28.95761453,
            longitude: 50.83710976,
        },
        key: 0,
      },
],

}

  }

  onMapPress(e) {
  
  this.setState({
    markers: [
      {
        coordinate: e.nativeEvent.coordinate,
        key: 0,
      },
    ],
  });
 
}

 SaveAddress=()=>{
console.log(JSON.stringify(this.state.markers[0].coordinate.latitude))
 }

  

  render() {
return (
  <View style={{flex:1}}>
 


 <MapView
          style={[styles.map]}
          initialRegion={{
            latitude: 28.95761453,
            longitude: 50.83710976,
            latitudeDelta: 0.0040,
            longitudeDelta: 0.0040,
          }}
        //   onMapReady={this.onMapReady}
            provider={ PROVIDER_GOOGLE}
            onPress={(e) => this.onMapPress(e)}
          >
          {this.state.markers.map(marker => (
            <Marker
              key={marker.key}
              coordinate={marker.coordinate}
            />
          ))}

 </MapView>
 <TouchableOpacity onPress={()=>this.SaveAddress()}>
  <Text>Save</Text>
   </TouchableOpacity>
 </View>
);
  }
}
const styles = StyleSheet.create({
map: {
    ...StyleSheet.absoluteFillObject,


},

});