nextjs router.events.on 在初始页面加载时未调用

Question

我有一个工作useEffect在更改页面时调用我的谷歌分析。这在更改页面时工作正常，但当您最初第一次加载或刷新时，它不会调用router.events.on

这是我的代码

 useEffect(() => {
    if (cookies === true) {
      router.events.on("routeChangeComplete", () => {            
        ReactGA.pageview(window.location.pathname);
      });
      return () => {
        router.events.off("routeChangeComplete", () => {
          ReactGA.pageview(window.location.pathname);
        });
      };
    }
  }, [router.events]);

我想过使用另一个useEffect来最初调用reactGA，但是当更改页面时它会被调用两次，这不好。

关于如何在初始页面加载时使其工作的任何想法？

Answer 1

这是预期的行为 -router.events仅在 Next.js 路由器启动的客户端页面导航时触发。

您可以调用ReactGA.pageview单独的方法useEffect来处理初始页面加载。

useEffect(() => {
    if (cookies === true) {            
        ReactGA.pageview(window.location.pathname);
    }
}, []);