用途:本资料整理 Expo Router 的常见模式,用于在 Expo/React Native 项目中组织导航与路由。
主要能力与用法:
- 基于文件的路由:路由由 app/ 目录结构自动发现,无需手动列出每个页面。
- Stack 配置:在根布局 app/_layout.tsx 中使用 Stack 组件,并通过 screenOptions 设置所有屏幕的默认值,例如 headerShown: false。
- 单屏配置:在各页面组件内使用 <Stack.Screen> 配置自身的 title、headerShown、headerBackTitle 等选项。
- 动态头部:使用 useNavigation 配合 useLayoutEffect 与 navigation.setOptions,可动态设置 headerRight 等头部内容。
- 原生标签页:通过 expo-router/unstable-native-tabs 引入 Icon、Label、NativeTabs,使用 NativeTabs.Trigger 定义标签,iOS 上支持 SF Symbols(sf 属性)与 Android drawable。
关键原则:_layout.tsx 定义所在目录的导航结构;括号目录如 (tabs) 创建不影响 URL 的路由组;只配置需要覆盖的部分。
需避免的问题:不要在 Stack 中显式列出所有屏幕;不要用 screenOptions 处理单个路由的专属设置;不要深层嵌套导航器,应改用文件路由。
限制:资料未提供安装命令、版本兼容性、平台差异细节或完整 API 说明,这些内容暂未提供。