如何用反应性路由器跟踪react ga事件

Question

我想在我的网络应用程序项目中用react跟踪事件。我在路由中使用了反应性路由器-dom，并且我总是使用Link重定向用户。我的标题中的一个示例--将用户引导到“探索”页面：

<Link to="/explore">
                <Icon
                  icon={pathname === "/explore" ? "compass" : "compass-outline"}
                />
              </Link>

如何准确地跟踪事件“用户去‘/探索’”我能找到的唯一指南告诉我如何跟踪由按钮和onClick()引起的事件。我已经将我的应用程序连接到谷歌分析，它可以很好地检测到我当前的位置。

 useEffect(() => {
    ReactGa.initialize("UA-175518918-1");
    ReactGa.pageview(window.location.pathname + window.location.search);
  }, []);

Answer 1

您在这里有几种选择：

1. 您可以使用如下链接组件：

<Link to="/explore" onClick={e=>ReactGa.pageview('explore')}>Explore</Link>

您可以收听路由更改，取决于react路由器的版本，如何做的代码将vary:

• If您使用的react路由器-3您可以使用listen方法的history

。

history.listen((location) => {
  ReactGa.pageview(location.pathname);
})

如果您使用react-4，您可以在这里查看解决方案：