google-map-react: Can't call setState on a component that is not yet mounted

Describe the bug 🐛

Im using with a project with React Hook, im using a reducer to set a coordinates in prop center of map, this set state happens when my component mout,

      useEffect(() => {
          if (coordinates && coordinates.lat) {
            setCenter({
             lat: coordinates.lat,
             lng: coordinates.lng,
         });
      }
     }, [coordinates]);

works but i got this error on my console of navigator

Can’t call setState on a component that is not yet mounted. This is a no-op, but it might indicate a bug in your application. Instead, assign to this.state directly or define a state = {}; class property with the desired state in the GoogleMapMarkers component. in GoogleMap (at Map/index.js:51) in div (created by styled.div) in styled.div (at Map/index.js:50) in div (created by styled.div) in styled.div (at Map/index.js:43) in div (created by styled.div) in styled.div (at Modal/index.js:9) in Modal (at Map/index.js:42) in Map (at companyRegister/index.js:167) in div (created by styled.div) in styled.div (at companyRegister/index.js:163) in CompanyRegister (at PrivateRoute.js:49) in Route (at PrivateRoute.js:45) in PrivateRoute (at routes/index.js:36) in Switch (at routes/index.js:29) in Router (at routes/index.js:28) in Routes (at App.js:23) in Router (at App.js:20) in Provider (at App.js:19) in App (at src/index.js:10) in StrictMode (at src/index.js:9)

I want to know if the Google Map React drop a prop when he is mounted, like

    <GoogleMapReact

      isMounted={boolean} => changes the value when map is fully mounted or unmouted

      />

My code :

                <GoogleMapReact
                    bootstrapURLKeys={{
                        key: process.env.REACT_APP_GOOGLE_KEY,
                    }}
                    defaultCenter={defaultCenter}
                    center={center}
                    defaultZoom={zoomMap}
                    onClick={onClickMap}
                    
                >
                    {children}
                </GoogleMapReact>

how i can do this, or fix the error on my navigator whitout remove my useEffect (onDidMount)?

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 2
Comments: 17 (6 by maintainers)

Most upvoted comments

Folks, I will close this issue because its not a problem with the library, you can continue your discussion though ofc.

itsmichaeldiego on May 7, 2020

Are you using React strict mode? Post your index.js code (if that’s where you mount the App)

darbio on May 2, 2020

Hey, it’s hard to tell what you are trying to accomplish. Could you provide a basic reproduction in a repo to take a look at? Just from your example, I don’t believe the issue is part of google-map-react.

Can't call setState on a component that is not yet mounted. implies you are trying to set a state in the outer* component, and not google-map-react

karldanninger on Apr 24, 2020