¿Alguien sabe por qué recibo el siguiente tipo de error? Estoy siguiendo este tutorial (alrededor de 59 minutos): https://www.youtube.com/watch?v=G5mmrBkCaP8
Aquí está mi código:
import React, { useState } from 'react'; import ReactMapGL from 'react-map-gl'; import { getCenter } from 'geolib'; function Map({ searchResults }) { const coordinates = searchResults.map((result) => ({ longitude: result.long, latitude: result.lat, })); // The latitude and longitude of the center of the coordinates const center = getCenter(coordinates); const [viewport, setViewport] = useState({ width: "100%", height: "100%", latitude: center.latitude, longitude: center.longitude, zoom: 10, }); return ( <ReactMapGL mapStyle='mapbox://styles/shesonanadventure/cl063x0yl000r15n4frjpm9in' mapboxAccessToken={process.env.mapbox_key} {...viewport} onViewportChange={(nextViewport) => setViewport(nextViewport)} ></ReactMapGL> ); } export default Map;SearchResults no está definido.
Haz searchResults && searchResults.map
También asegúrate de pasar el accesorio.