Answer the question
In order to leave comments, you need to log in
How to open GoogleMapReact when navigating to a page?
I use 'google-map-react'
When used without Next.js everything works fine
But with Next.js the map appears only when the page with the map is reloaded, and if you go to the page with the map via Link, the map is not displayed
What is the reason ?
Map file:
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Helmet } from 'react-helmet';
import GoogleMapReact from 'google-map-react';
import { bindActionCreators } from 'redux';
import { getRestaurants, setRestaurants } from '../../store/actions/addressActions';
import {
DEFAULT_CENTER,
getRestaurantLocation,
GOOGLE_MAPS_API_KEY,
getRestaurantWorkingTimes,
isClient
} from '../../utils';
import { sendPageView } from '../../googleAnalyticsHelper';
import { withRouter } from 'next/router';
class RestaurantManager extends Component {
componentDidMount() {
const { router, ssrProps, addressData, boundSetRestaurants, boundGetRestaurants } = this.props;
sendPageView(router.asPath, 'Restoranlar sayfası'); //for ga
if (isClient() && ssrProps.addressData.restaurants.length && !addressData.restaurants.length) {
boundSetRestaurants(ssrProps.addressData.restaurants);
}
}
render() {
return <div className="restaurant-map">
<Helmet title="En Yakın Pizza Hut Restoranları">
<meta name="description"
content="Size en yakın Pizza Hut restoranlarını görüntüleyebilir, açılış-kapanış saatleri ve adres bilgilerini görüntüleyebilirsiniz."/>
</Helmet>
<GoogleMapReact
bootstrapURLKeys={GOOGLE_MAPS_API_KEY}
defaultZoom={12}
center={DEFAULT_CENTER}
/>
</div>;
}
}
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question