在Google maps infowindow中添加NavLink（React + React Router v4）

Question

我正在使用带有React，React Router v4的Google地图（没有像react-google-maps那样的任何软件包）。我需要将React Router v4组件（NavLink或Link）放在infowindow中。我试图使用ReactDomServer.renderToString（）。

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

this.infoWindow.setContent(infoWindowContent);

我从Render react-router <Link> inside google InfoWindow

获得了解决方案

不幸的是它不起作用：

  

你不应该在＆lt;之外使用或withRouter（）。路由器＆gt;

这是可以理解的，因为路由器超出了范围。

你有什么想法如何解决它？

Answer 1

最后我切换到https://github.com/istarkov/google-map-react，这解决了我的问题。

另一个想法（肮脏的解决方案）：

将历史记录放在全局窗口变量中：

import createHistory from 'history/createBrowserHistory';

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

在infowindow组件中这样做：

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

this.infoWindow.setContent(infoWindowContent);