Как распечатать широту по кнопке в реагировать родные карты? - PullRequest
Новая
       19

Как распечатать широту по кнопке в реагировать родные карты?

0 голосов
/ 26 марта 2019

Я использую 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>

1 Ответ

1 голос
/ 26 марта 2019

Потому что, когда вы впервые нажимаете эту кнопку, чтобы выполнить эту функцию 

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,


},

});
...