Объединение Google-карты-реагировать с реагировать-маршрутизатор - PullRequest
0 голосов
/ 10 июля 2019

Так что я рендерим кучу <Marker />, которые дают google-maps-react Проблема в том, что не похоже, что google-maps-react нравится, когда я добавляю <Link />, который приходит от react-router-dom

Вот как я это собрал:

render() {
    return (
      <div>
        <Map
          google={this.props.google}
          zoom={14}
          styles={this.props.mapStyles}
          disableDefaultUI={true}
          onClick={this.saveCoords}
        >
          {this.state.data.map(m => {
            return (
              <Link to={`/c/contribution/${m.id}`}>
                <Marker position={{ lat: m.x, lng: m.y }} title={m.title} />
              </Link>
            )
          })}
        </Map>
      </div>
    )
  }

Я пытался использовать window.location вместо этого, но это перезагружает страницу, и я не хочу этого.

Я получаюэта ошибка с приведенным выше кодом, для меня не имеет смысла:

Warning: React does not recognize the `mapCenter` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `mapcenter` instead. If you accidentally passed it from a parent component, remove it from the DOM element.

С этим я пытаюсь получить кликабельный <Marker/>, который будет отображать другой элемент.Доступ к этому конкретному элементу можно получить, открыв Route, присутствующий в примере кода.

Используемый маршрут:

<Route path='/c/contribution/:id' component={Contribution} />
...