分析屏幕追踪

编辑

学习如何在使用 Expo Router 时启用分析的屏幕追踪。

与 React Navigation 不同，Expo Router 始终可以访问 URL。这意味着屏幕追踪和网页一样简单。

创建一个高阶组件，观察当前选定的 URL
在你的分析提供者中追踪 URL

app

_layout.tsx

app/_layout.tsx

import { useEffect } from 'react';
import { usePathname, useGlobalSearchParams, Slot } from 'expo-router';

export default function Layout() {
  const pathname = usePathname();
  const params = useGlobalSearchParams();

  // 在你的分析提供者中追踪位置。
  useEffect(() => {
    analytics.track({ pathname, params });
  }, [pathname, params]);

  // 以最基本的方式导出所有子路由。
  return <Slot />;
}

现在，当用户更改路由时，分析提供者将收到通知。

从 React Navigation 迁移

React Navigation 的屏幕追踪指南不能进行与 Expo Router 相同的导航状态假设。因此，实施需要使用 onReady 和 onStateChange 回调。如果可能，避免使用这些方法，因为根 <NavigationContainer /> 并未直接暴露，并允许在 Expo Router 中进行级联。