REACT NATIVE MAPS: Я не могу отобразить маркеры для моей собственной карты React?

Question

import React from 'react';
import { StyleSheet, Text, View, Component, Dimensions } from 'react-native';
import { fb } from "./Firebase/data";
import firestore from 'firebase/firestore';
import MapView, { Marker } from 'react-native-maps';

export default class App extends React.Component {

  state = {
      nodes: []
    }

  componentDidMount(){
        const db = fb.firestore()
          .collection('nodes')
          .get()
          .then( snapshot => {
            const nodes = []
            snapshot.forEach( doc =>{
              const data = doc.data()
              nodes.push(data)
            });
         this.setState({
          nodes : nodes
        })
      });
    }

    render() {
      console.log(this.state.nodes.lat)
      return (
        <MapView
        style={{ ...StyleSheet.absoluteFillObject }}
        initialRegion={{
          latitude: 28.5450,
          longitude: 77.1926,
          latitudeDelta: 0.0039922,
          longitudeDelta: 0.0039421,
        }} >

{this.state.nodes.map((marker, index) => {
      <Mapview.Marker 
        key = {index}
        coordinate = {{ latitude : marker.lat}, 
                      { longitude : marker.lon}}
        title = { marker.location }
        />
        } 
        )
      }

        </MapView>
      );
    }
}
console.disableYellowBox = true;
const styles = StyleSheet.create({
container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
      },
  mapStyle: {
    width: Dimensions.get('window').width,
    height: Dimensions.get('window').height,
  },
})

Это мой родительский код для собственного проекта реакции. При необходимости я также могу показать код экспорта fb, но я уверен, что он работает

Может кто-нибудь, пожалуйста, скажите мне, что здесь не так, поскольку данные из firebase доступны на консоли, когда я не вызываю Mapview, а просто когда я вызываю его Mapview, консоль показывает Array [].

Я просто хочу отобразить маркеры на карте

Answer 1

Вы ничего не вернули на карте:

Неправильно: this.state.nodes.map(()=>{}),

Верно: this.state.nodes.map(()=>())

Верно v2: this.state.nodes.map(()=>{ return ... })

Окончательный код должен выглядеть так:

{this.state.nodes.map((marker, index) => (
  <Mapview.Marker
    key={index}
    coordinate={({ latitude: marker.lat }, { longitude: marker.lon })}
    title={marker.location}
  />
))}