google-maps-react icon indicating copy to clipboard operation
google-maps-react copied to clipboard

fix markers rerender when click to open InfoWindow

Open deadkff01 opened this issue 6 years ago • 5 comments

Solving issue #269

In Marker.js componentDidUpdate()

this.props.position and prevProps.position will never be equal after component is fully rendered in first time, because these properties are objects, for this reason I use the lat and lng to compare after the first rendering.

deadkff01 avatar Jan 28 '19 01:01 deadkff01

@deadkff01 , I came across that issue recently. I did the same comparison but in shouldComponentUpdate method. Can I ask you why you've opted to the componentDidUpdate? Thanks

m-bartenev avatar May 25 '19 22:05 m-bartenev

@m-bartenev, I did the comparison in componentDidUpdate only to keep the same code structure. :)

deadkff01 avatar May 26 '19 16:05 deadkff01

@deadkff01 , I see :) Thank you for your answer!

m-bartenev avatar May 26 '19 19:05 m-bartenev

To anyone who comes across this bug, here is a patch you can use until things are merged, should stop the constant re-renders:

class CustomMarker extends Marker {
  componentDidUpdate(prevProps) {
    if(
      this.props.map !== prevProps.map || 
      this.props.icon.url !== prevProps.icon.url || 
      (
        this.props.position.lat !== prevProps.position.lat || 
        this.props.position.lng !== prevProps.position.lng
      )
    ) {
      if(this.marker) {
        this.marker.setMap(null);
      }
      this.renderMarker();
    }
  }
}

srobertson421 avatar Jun 15 '19 05:06 srobertson421

Nice @srobertson421

deadkff01 avatar Aug 06 '19 17:08 deadkff01