Hinzufügen von NavLink in Google Maps Infofenster (React + React Router v4)

Question

Ich verwende Google Maps mit React, React Router v4 (ohne irgendein Paket wie react-google-maps). Ich muss React Router v4 Komponente (NavLink oder Link) in infowindow setzen. Ich habe versucht, ReactDomServer.renderToString() zu verwenden.

const infoWindowContent = ReactDOMServer.renderToString(
      <NavLink to="project/5">Show</NavLink> 
     ); 

this.infoWindow.setContent(infoWindowContent); 

habe ich Lösung aus: Render react-router <Link> inside google InfoWindow

Unfortunatelly funktioniert es nicht:

Sie sollten nicht einen < Router>

Diese außerhalb verwenden oder withRouter() ist durchaus verständlich, weil der Router außer Reichweite ist.

Haben Sie irgendwelche Ideen, wie Sie es beheben können?

Answer 1

Endlich wechselte ich zu https://github.com/istarkov/google-map-react und dies löste mein Problem.

---

Eine weitere Idee (dirty Lösung):

Put Geschichte in globalen Fenstervariable:

import createHistory from 'history/createBrowserHistory'; 

if (!window.AppHistory) { 
    window.AppHistory = createHistory(); 
} 

In Infofenster Komponente tun wie folgt aus:

const infoWindowContent = `<a class="infowindow" onclick="AppHistory.push('/project/${id}')">Show</a>`; 

this.infoWindow.setContent(infoWindowContent);