mapCenter warning

[brightsider]

trafficstars

How to fix this warning? React does not recognize the mapCenterprop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercasemapcenter instead. If you accidentally passed it from a parent component, remove it from the DOM element.

[SimantoR]

Can you provide a sample code? That should help understand what's triggering the warning

[alamorre]

<Map
    zoom={14}
    google={this.props.google}  
    initialCenter={{ lat: this.props.latitude, lng: this.props.longitude }}
    center={{ lat: this.props.latitude, lng: this.props.longitude }}
>
    {/*Standard JSX*/}
</Map>

I get the same issue. "The unknown-prop warning will fire if you attempt to render a DOM element with a prop that is not recognized by React as a legal DOM attribute/property."

They recommend to change it to lowercase to make it a legal name again. If you change mapCenter to mapcenter you should be good. But user can't do much about it.

People (like myself) need it to update the center when onDragend occurs.

[vikaskulkarni]

Even though I was not using the center attribute, I was still get this warning when I wrapped one Map component inside another (the top one was not visible though, it was just to get the props).

Did you try setting the center instead of passing it as an attribute?

let currentPosition = {
    lat: position.coords.latitude,
    lng: position.coords.longitude
};
map.setCenter(currentPosition);

[elderferreiras]

I'm getting the same warning. Just noticed today:

React does not recognize the `mapCenter` prop on a DOM element