He pasado más de 4 horas resolviendo este problema sin suerte. Recientemente comencé a aprender a codificar con React y JavaScript para crear una aplicación que permita a los usuarios agregar sus ubicaciones favoritas a una lista.
Pude conectarme a firestore y devolver los datos a un estado, pero por alguna razón, no puedo acceder a ellos en "render()" y "return()". Mi consola registra los valores como la longitud y la latitud, pero cuando accedo al estado no funciona. Aquí está el código, mira abajo para las fotos
state = { regionSet: false, } componentDidMount() { Geolocation.getCurrentPosition(position => { const { latitude, longitude } = position.coords const region = { ...this.state.region, latitude, longitude, latitudeDelta: 0.008, longitudeDelta: 0.008, } this.setState({ region, regionSet: true }) }) userData = async () => { const user = auth().currentUser; var userRef = firestore().collection('favoritelist').doc(user.uid).collection(user.uid); const markers = []; await firestore().collection('favoritelist').doc(user.uid).collection(user.uid).get() .then(querySnapshot => { querySnapshot.docs.forEach(doc => { markers.push(doc.data()); });}); this.setState({markers}); console.log(this.state.markers) console.log(this.state.markers[0].lat) }; userData() } render() { const { markers } = this.state const user = auth().currentUser; const mapRegion = {latitude: 37.782822, longitude: -122.4067605} return ( <View> {console.log(markers)} <Text> {this.state.markers[0].lat} </Text> </View>la consola registra los datos/estado perfectamente bien
el estado no funciona en un texto y regresa
Gracias por leer y ayudar si es posible :)
Entonces, básicamente, lo que está sucediendo es que su componente React obtiene los datos de Fire-Store, pero el componente ya está renderizado y la forma más fácil de solucionarlo es cambiar los markers[0].lat a markers[0]?.lat .lat. Esto mostrará los datos una vez que estén disponibles. Espero que esto solucione tu problema