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

Additional div rendered?

Open hashharvest opened this issue 7 years ago • 2 comments

I noticed that the component renders an additional DIV in the GoogleApiComponent file during the render (see line 119 in file).

Why not add ability for className on this DIV or use a different sort of wrapper using something like:

const wrapper = (props) => props.children;

So the additional div is not rendered? Or is there a reason a div was used?

hashharvest avatar Jun 21 '18 00:06 hashharvest

Guys, it took too much time to be fixed this and I've forked and created my own version to fixed. I've also opened a pull request on this repo, let's see if they'll merge it, eventually.

The pull request: https://github.com/fullstackreact/google-maps-react/pull/483

My branch with the fix: https://github.com/bertuz/google-maps-react/tree/stylized-div-wrapper

My branch with built files, in order to use it with npm (or yarn or whatever): https://github.com/bertuz/google-maps-react/tree/wrapping-div-with-styles

To use it directly you can add it like this:

yarn add "https://github.com/bertuz/google-maps-react.git#v2.0.7-alpha.1"

bertuz avatar Oct 03 '20 15:10 bertuz

After running into this problem myself, and seeing that it's unlikely to be resolved here, I "solved" it by using @googlemaps/react-wrapper instead. One caveat is that I couldn't just replace it in one place or component, I had to make the same change everywhere in my application to avoid loading the Google Maps API twice. That library didn't exist when this issue was first reported, so it's a new option for anyone running into the problem today.

LucasBrandt avatar Sep 08 '21 20:09 LucasBrandt