Quiero incluir un mapa con la API google-map-react, pero siempre recibo el siguiente error:
google_map.js:428 TypeError no detectado: no se pueden leer las propiedades de undefined (leyendo 'emit') en orcomponentDidUpdate (google_map.js:428:1) en commitLayoutEffectOnFiber (react-dom.development.js:23232:1) en commitLayoutMountEffects_complete (react- dom.development.js:24578:1) en commitLayoutEffects_begin (react-dom.development.js:24564:1) en commitLayoutEffects (react-dom.development.js:24502:1) en commitRootImpl (react-dom.development.js :26779:1) en commitRoot (react-dom.development.js:26638:1) en finishConcurrentRender (react-dom.development.js:25937:1) en performConcurrentWorkOnRoot (react-dom.development.js:25765:1) en workLoop (planificador.desarrollo.js:266:1)
import React from 'react' import GoogleMapReact from 'google-map-react' import {Paper, Typography, useMediaQuery} from '@material-ui/core' import LocationOnOutlinedIcon from '@material-ui/icons/LocationOnOutlined'; import Rating from "@material-ui/lab" import useStyles from './styles' const Map = () =>{ const classes = useStyles(); const isMobile= useMediaQuery("(min-width:600px)"); const coords = {lat:0, lng:0} const API_KEY = "############" return( <div className={classes.mapContainer}> <GoogleMapReact bootstrapURLKeys={{ key: API_KEY }} defaultCenter={coords} center={coords} defaultZoom={14} margin={[50, 50, 50, 50]}> </GoogleMapReact> </div> ) } export default Map;Parece que esto resuelve el problema:
https://github.com/google-map-react/google-map-react/issues/1116#issuecomment-1150589667
De lo contrario, puede hacerlo lanzando su next.config.(js/ts)
reactStrictMode: false,